سؤال

أحاول إزالة جميع العناصر الشقيقة بعد قسم معين، لنفترض علامة div ذات المعرف = id8.

<form>    
<div id="id5">something ...<div>
<div id="id8">something ...<div>
<div id="id3">something ...<div>
<div id="id97">something ...<div>
<div id="id7">something ...<div>
...
<div id="idn">some text ...<div>
</form>

للقيام بذلك أستخدم الكود التالي في jquery.

$("#id8 ~ div").remove();

إنه يعمل بشكل جيد في Firefox، لكنه لا يعمل في IE7.

هل هناك طريقة بديلة لأرشفة ذلك، باستخدام jquery وإعطاء معرف العلامة من العنصر الذي أريد البدء في إزالة العناصر؟شكرًا


شكرًا للجميع على مساعدتك ، انتهى بي الأمر إلى هذا الحل بناءً على الإجابة المقبولة

function removeAfter(el,tag){
    element = $('#'+el);
    var aElements = $(tag,element.parent());
    var index = (aElements.index(element));

    for(i=(index+1);i<aElements.length;i++) {
        $('#'+$(aElements.get(i)).attr('id')).remove();
    }
}

اتصل وحسب

removeAfter('id8', 'div')
هل كانت مفيدة؟

المحلول

ثلاث خطوات هنا:

  • ابحث عن رقم فهرس العنصر الذي نقرنا عليه، بالنسبة إلى العنصر الأصلي.
  • قم بالمراجعة عبر جميع عناصر div الموجودة داخل هذا الأصل، بدءًا من العنصر الذي وجدناه للتو
  • احذف كل div تم العثور عليه

    $(document).ready(function(){
            $('#parent').children().click(function(){
                var index = ($('div',$(this).parent()).index(this));
                for(i=(index+1);i<$('div',$(this).parent()).length;i++){
                    $($('div',$(this).parent()).get(i)).hide();
                }
            });
    });
    

سيعمل هذا على HTML هذا

<div id="parent">
    <div id="c1">c1</div>
    <div id="c2">c2</div>
    <div id="c3">c3</div>
    <div id="c4">c4</div>
    <div id="c5">c5</div>
</div>

قم بالتعليق هنا إذا كان لديك أي مشاكل أخرى في هذا الشأن!

ملاحظة.تطبيق هذا الحل الدقيق لطلبك هو ما يلي

function removeAfter(el){
    element = $('#'+el);
    var index = ($('*',element.parent()).index(element));
    for(i=(index+1);i<$('*', element .parent()).length;i++){
        $($('*', element.parent()).get(i)).hide();
    }
};

نصائح أخرى

شيئان!

1) أغلق علامات <div> الخاصة بك!يجب أن تبدو هذه:

<form>
    <div id="id5">something ...</div>
    <div id="id8">something ...</div>
    <div id="id3">something ...</div>
    <div id="id97">something ...</div>
    <div id="id7">something ...</div>
    <div id="idn">some text ...</div>
</form>

2) ال ~ يطابق عامل التشغيل فقط الأشقاء الذين يتبعون العنصر المطابق (أي أنه سيطابق معرف3, معرف97, معرف7 و معرف, ، لكن لا معرف5).لتتناسب مع كل شقيق، بما في ذلك معرف5, ، أنت تفعل هذا:

$("#id8").siblings("div").remove();

يجب أن يتركك فقط معرف8.لقد اختبرت هذا في Firefox 3.5.5 وIE7.0something.امل ان يساعد!

وتحرير:

وتحرير الجواب أدناه لإضافة ما ينبغي أن يكون إصلاح المشكلة:

$("#id8").nextAll().remove();

وEND تحرير.

وطيب. ويبدو أن هذا علة مثيرة للاهتمام - الاختبارات الأولية يبدو أنها تشير إلى انها علة مسج على الرغم من أنني لم أجد أي إشارة محددة في أي مكان

وعلة ويبدو أن ذلك إذا كان لديك بطاقة محدد الأولية هي من نفس نوع أشقاء له بعد ذلك سوف تفشل في إرجاع أية الأشقاء في IE7.

واختبرته باستخدام مسج سبيل المثال رمز محدد نفسه وكان قادرا على تكرار مشكلتك في IE8 محاكاة IE7.

إذا تحقق رمز المثال مسج انا العصا أدناه يمكنك أن ترى أن العنصر الفعلي الذي تستخدمه لمحدد الأولي هو span والعناصر الأخوة كلها divs whcih يبدو لي أن تبين أنهم يعرفون عن هذا علة وولم يتم توثيقها، والتي هي على حد سواء المكر وغزر.

<script>
  $(document).ready(function(){
    $("#prev ~ div").css("border", "3px groove blue");
  });
</script>

  <div>div (doesn't match since before #prev)</div>
  <span id="prev">span#prev</span>
  <div>div sibling</div>
  <div>div sibling <div id="small">div niece</div></div>
  <span>span sibling (not div)</span>
  <div>div sibling</div>

وتغيير #prev span إلى div وستحصل على نفس الفشل الذي تحصل عليه حاليا. فما استقاموا لكم فاستقيموا تقديم الشوائب مع فريق مسج.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top