jqueryは兄弟要素を削除し、IE7では機能しません

Question

特定のdivの後にあるすべての兄弟要素を削除しようとしています。id= id8の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>

そのために、jqueryで次のコードを使用します。

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

Firefoxでは正常に動作しますが、IE7では動作しません。

jqueryを使用し、要素の削除を開始したい要素からタグIDを与えるだけで、これを実現する別の方法はありますか？ ありがとう

---

皆さんのご協力に感謝します 私は受け入れられた答えに基づいてこの解決策になります

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

ここに3つのステップ：

• クリックした要素のインデックス番号を、その親に関して見つけます。
• この親内に含まれるすべての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>

問題についてさらに問題がある場合は、ここにコメントしてください！

PSあなたのリクエストにぴったりのこのソリューションのアプリケーションは次のとおりです

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

2つのこと！

1）<！> lt; div <！> gt;を閉じます。タグ！次のようになります。

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

編集：

以下の回答を編集して、問題の解決策を追加します。

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

編集の終了。

わかりました。これは興味深いバグのようです-最初のテストではjqueryバグであることを示しているようですが、具体的な言及はどこにもありません。

バグは、最初のセレクタタグがその兄弟と同じタイプである場合、IE7で兄弟を返すことができないということです。

セレクター自体のjQueryサンプルコードを使用してテストし、IE7をエミュレートするIE8で問題を再現できました。

jqueryのサンプルコードを確認すると、最初のセレクタとして使用している実際の要素はspanであり、兄弟要素はすべてdivsであることがわかります。彼らはこのバグについて知っていて、それを文書化していない。それはcであり、くだらないものである。

<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チームにバグを送信します。