jquery Remover irmãos elementos, não funciona no IE7

Question

Eu estou tentando remover todos os elementos irmãos depois de um div particular, digamos que a tag div com 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>

Para fazer isso eu uso o seguinte código em jQuery.

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

Ele funciona bem no Firefox, mas ele não funciona no IE7.

Existe uma forma alternativa para archieve isso, usando jQuery e apenas dando o ID tag do elemento que eu quero começar a remover os elementos? Graças

---

Obrigado a todos por sua ajuda Eu acabar com esta solução com base na resposta aceite

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

apenas chamada

removeAfter('id8', 'div')

Answer 1

Três passos aqui:

• Encontre o número de índice do elemento que clicou, em relação ao seu pai.
• percorrer todos os elementos div contidas neste pais, começando depois do que acabamos encontrados

• Excluir cada div encontrados

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

Este trabalho vontade sobre este 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>

Comente aqui se você tem mais problemas sobre o assunto!

P.S. Uma aplicação desta solução exata para o seu pedido é o seguinte

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 2

Duas coisas!

1) Feche o

marcas! Deve olhar como este:

<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) O ~ operador só corresponde irmãos que seguem o elemento correspondente (ou seja, ele irá corresponder id3 , id97 , ID7 e IDN , mas não ID5 ). Para combinar com cada irmão, incluindo ID5 , você fazer isso:

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

Isso deve deixá-lo com apenas ID8 . Eu testei isso no Firefox 3.5.5 e IE7.0something. Espero que ajude!

EDIT:

Editar a resposta abaixo para adicionar o que deve ser uma solução para o problema:

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

END EDIT.

Ok. Este parece ser um bug interessante -. Teste inicial parece indicar que é um bug jquery embora eu não encontrei nenhuma menção específica lo em qualquer lugar

O bug parece ser que, se sua tag selector inicial é do mesmo tipo que seus irmãos, em seguida, ele vai deixar de devolver quaisquer irmãos no IE7.

Eu testei usando o código de exemplo jQuery para o próprio seletor e foi capaz de duplicar o seu problema no IE8 emular IE7.

Se você verificar o código de exemplo jquery eu vou ficar abaixo você pode ver que o elemento real que eles estão usando como seletor inicial é um span e irmão elementos são todos divs whcih parece-me indicar que eles sabem sobre este bug e não têm documentado, o que é tanto astúcia e merda.

<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>

Alterar o #prev span a um div e você vai ter a mesma falha que você está recebendo atualmente. Eu enviar um bug com o time da jQuery.

Answer 3

EDIT:

Editar a resposta abaixo para adicionar o que deve ser uma solução para o problema:

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

END EDIT.

Ok. Este parece ser um bug interessante -. Teste inicial parece indicar que é um bug jquery embora eu não encontrei nenhuma menção específica lo em qualquer lugar

O bug parece ser que, se sua tag selector inicial é do mesmo tipo que seus irmãos, em seguida, ele vai deixar de devolver quaisquer irmãos no IE7.

Eu testei usando o código de exemplo jQuery para o próprio seletor e foi capaz de duplicar o seu problema no IE8 emular IE7.

Se você verificar o código de exemplo jquery eu vou ficar abaixo você pode ver que o elemento real que eles estão usando como seletor inicial é um span e irmão elementos são todos divs whcih parece-me indicar que eles sabem sobre este bug e não têm documentado, o que é tanto astúcia e merda.

<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>

Alterar o #prev span a um div e você vai ter a mesma falha que você está recebendo atualmente. Eu enviar um bug com o time da jQuery.