jquery entfernen Elemente Geschwister, funktioniert nicht in IE7

StackOverflow https://stackoverflow.com/questions/1803449

Frage

Ich versuche, nach einem bestimmten div all Geschwisterelemente zu entfernen, kann mit id = ID8 den div-Tag sagt. 

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

Zu tun, dass ich den folgenden Code in jquery verwenden. 

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

Es funktioniert gut in Firefox, aber es funktioniert nicht in IE7.

Gibt es eine alternative Möglichkeit, dies zu archieve, jquery verwenden und gibt nur das Tag-ID von dem Elemente Ich mag die Elemente entfernen beginnen? Dank

Vielen Dank allen für Ihre Hilfe Ich schließe mit dieser Lösung bis auf der Grundlage der akzeptierten Antwort 

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

einfach anrufen 

removeAfter('id8', 'div')
War es hilfreich?

Lösung

Drei Schritte hier:

  • Finden Sie die Indexnummer des Elements wir geklickt haben, in Bezug auf seine Eltern.
  • Schleife durch alle div-Elemente innerhalb dieser Eltern enthalten, beginnend nach dem einen fanden wir nur

  • Löschen jedes Div, gefunden 

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

Dies wird auf dieser HTML arbeitet 

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

hier kommentieren, wenn Sie zu diesem Thema noch mehr Probleme haben!

P. S. Eine Anwendung dieser Lösung genau auf Ihre Anfrage ist die folgende 

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

Andere Tipps

Zwei Dinge!

1) Schließen Sie die

-Tags! Es soll wie folgt aussehen: 

<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) Die ~ Operator nur Geschwister übereinstimmt, die das verglichene Element folgen (dh es wird übereinstimmen ıd3 , id97 , ID7 und IDN , aber nicht ID5 ). Um alle Geschwister zu entsprechen, einschließlich ID5 , Sie dies tun: 

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

Das sollten Sie verlassen mit nur ID8 . Getestet habe ich diese in Firefox 3.5.5 und IE7.0something. Hoffe, das hilft!

EDIT:

Bearbeiten der Antwort unten hinzuzufügen, was eine Lösung für das Problem sein sollte: 

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

END EDIT.

Ok. Dies scheint ein interessanter Bug zu sein -. Erstprüfung es ist ein jquery Fehler anzuzeigen scheint, obwohl ich keine spezifische Erwähnung es überall gefunden

Der Fehler scheint zu sein, dass, wenn Ihr erster Selektor-Tag vom gleichen Typ wie seine Geschwister ist, dann wird es scheitern Geschwister in IE7 zurückzukehren.

Ich habe es getestet, den jQuery Beispiel-Code für den Wähler selbst mit und war in der Lage, Ihr Problem zu duplizieren in IE8 IE7 emuliert wird.

Wenn Sie überprüfen die jquery Beispiel Code, den ich hafte unter Ihnen, dass das eigentliche Element sehen sie als Ausgangswähler verwenden ist ein span und die Geschwisterelemente sind alle divs Whcih mir scheint, dass sie darüber Bescheid wissen, um anzuzeigen, Fehler und haben es nicht dokumentiert, was sowohl List und beschissen ist. 

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

ändern Sie den #prev span zu einem div und Sie werden die gleichen Fehler erhalten, wie Sie gerade bekommen. Ich würde einen Fehler mit dem jquery Team einreichen.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top