jquery удаляет элементы одного уровня, не работает в IE7

Question

Я пытаюсь удалить все элементы одного уровня после определенного div, скажем, тег div с id = 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')

Answer 1

Две вещи!

1) Закройте ваши

теги! Это должно выглядеть так:

<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) Оператор ~ соответствует только братьям и сестрам, которые следуют за соответствующим элементом (т. Е. Он будет соответствовать id3 , id97 , id7 и idn , но не id5 ). Чтобы соответствовать каждому брату, включая id5 , вы делаете это:

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

Это должно оставить вас с id8 . Я проверял это в Firefox 3.5.5 и IE7.0. Надеюсь, это поможет!

Answer 2

Три шага здесь:

• Найдите порядковый номер элемента, по которому мы щелкнули, относительно его родителя.
• Перебрать все элементы 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>

Прокомментируйте здесь, если у вас есть еще проблемы по этому вопросу!

P.S. Приложение этого решения точно к вашему запросу следующее

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();
    }
};

Answer 3

EDIT:

Редактирование ответа ниже, чтобы добавить исправление проблемы:

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

END EDIT.

Ok. Это кажется интересной ошибкой - первоначальное тестирование указывает на то, что это ошибка jquery, хотя я нигде не нашел конкретного упоминания о ней.

Ошибка, по-видимому, заключается в том, что если ваш начальный тег селектора того же типа, что и его братья и сестры, то он не сможет вернуть никаких братьев и сестер в IE7.

Я протестировал его, используя пример кода jQuery для самого селектора, и смог дублировать вашу проблему в IE8, эмулируя IE7.

Если вы посмотрите пример кода jquery, который я добавлю ниже, вы увидите, что фактический элемент, который они используют в качестве начального селектора, - это span, а все родственные элементы - divs, что, как мне кажется, указывает они знают об этой ошибке и не документировали ее, что является одновременно хитрым и дерьмовым.

<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, и вы получите ту же ошибку, что и в настоящее время. Я бы отправил сообщение об ошибке команде jquery.