0

特定の ID を持つスパンまでのスパンの数をカウントするにはどうすればよいですか。

例えば:

id="a5" のスパンまでは6 番目のスパンです。

<table border="3">
    <tr>
        <td><span id="a2" class="arrow_icon a6" isClicked="0"></span></td>
        <td><span id="a1" class="arrow_icon a1" isClicked="0"></span></td>
        <td><span id="a3" class="arrow_icon a11" isClicked="0"></span></td>
        <td><span id="a4" class="arrow_icon a16" isClicked="0"></span></td>
        <td><span id="a6" class="arrow_icon a2" isClicked="0"></span></td>
    </tr>
    <tr>
        <td><span id="a5" class="arrow_icon a21" isClicked="0"></span></td>
        <td><span id="a7" class="arrow_icon a7" isClicked="0"></span></td>
        <td><span id="a8" class="arrow_icon a12" isClicked="0"></span></td>
        <td><span id="a9" class="arrow_icon a17" isClicked="0"></span></td>
        <td><span id="a10" class="arrow_icon a22" isClicked="0"></span></td>
    </tr>
</table>

私は次のようなものを試しました:

var count = 0;
$("span:first").nextUntil("#a5").andSelf().each(function(index) {
     count++;
});
alert(count); // should alert '6'

どんな助けでも大歓迎です!

4

5 に答える 5

2

.nextUntil()は兄弟を見ており、例のすべてのスパン要素が兄弟であるとは限らないため、使用できません。セレクターを$(...)配置すると、DOM 内の要素の順序を尊重する jQuery オブジェクトが生成されるはずです。

var count = 0;
$("span").each(function(i) {
    count++;
    if (this.id === "a5") {return false;} // breaks out of loop when the id is found
});

console.log(count);
于 2013-09-22T22:06:01.417 に答える
1

兄弟ではないため、 nextUntil() は使用できません。これが私が考える最良の方法です。

var a5index;
$('table span').each(function(idx){
  if( $(this).is('#a5')){
    a5Index = idx;
    return true; // No reason to keep going after we find it...
  }
});
于 2013-09-22T22:10:40.710 に答える
1

まず、最初の選択には、最初の .xml に span 要素が1 つしか<td>...</td>含まれていません。したがって、むしろに変更する必要があります$("span")...

次に、nextUntil関数は、選択した項目の兄弟間で検索します。jQueryドキュメントを見て、次のことを確認してください。

次は仕様まで

つまり、スパンのコレクションが ... ゼロに変わります。なんで?それらの直接の親は、<td>...</td>スパンを 1 つだけ含むタグであるため、実際には兄弟はありません

解決策は非常に簡単です。

var count = 0;

$("span").each(function(i, e){
    if(!$(this).is("#a5"))
        count++; //count it up
    else
        return false; //exit the each function
});

alert(count); //alerts '5', as it should

これが機能する主な理由は、DOM で表示される方法で選択が既にソートされているためです。そうでなければ、それで何かをするのは非常に難しいでしょう.

乾杯

于 2013-09-22T22:12:55.210 に答える
0

return false を使用して .each ループから早期に抜け出します

var count = 0;
var toId = "a5";
$("span").each(function(){
   count++;
   if(this.id == toId) {
      return false;
   }
});
console.log(count);

または.indexを使用して単一行を使用します

console.log( $("span").index($("#a5")) );
于 2013-09-22T21:59:49.987 に答える