2012-04-23 16 views
0

私はこのリストjqueryのUL李セレクタ

<ul style="display:none"> 
    <li id="key1" title="Look, a tool tip!">item1 with key and tooltip 
    <li id="key2" class="selected">item2: selected on init 
    <li id="key3" class="folder">Folder with some children 
    <ul> 
     <li id="key3.1">Sub-item 3.1 
     <li id="key3.2">Sub-item 3.2 
    </ul> 

    <li id="key4" class="expanded">Document with some children (expanded on init) 
    <ul> 
     <li id="key4.1">Sub-item 4.1 
     <li id="key4.2">Sub-item 4.2 
    </ul> 
</ul> 

を持つクエリとの「ID」で>各<リーを選択する方法はありますか?

アイブ氏はこのようにそれをしようと試みたが、その、今答えを

$("ul li:#key1").qtip({ 
     content: '<img src="icons/Icon.png" />' 
    }); 

ありがとうの作業が、上記のいずれも働いていなかった。..アイブ氏は、この

$("ul li:first").qtip({ 
content: '<img src="icons/Icon.png" />' 
}); 

をしようと試みやQティップを見ることができイムリストの最初のもの(key1)のみ。

$("ul li#key1").qtip({ 
content: '<img src="icons/Icon.png" />' 
}); 

または

をしようと
$("#key1").qtip({ 
content: '<img src="icons/Icon.png" />' 
}); 

その私のために働いていない... =/

+0

どうしてそんなことをしたいのですか? – pomeh

+0

私はDynatreeとqTipプラグインを使用しています。私はすべてのノードにイメージ付きのツールチップを入れたいと思っています。 –

+0

実際、私はあなたがしたい*選択*を理解していません。すべての 'li'を' $( "li") 'だけ使うようにしたいのであれば、そのidに基づいて特定の要素を望むなら' $( "#someIdName") ' – pomeh

答えて

0

なぜ余分なコロン:?あなたはそれを必要としません。

$("ul li#key1").qtip({ 
    content: '<img src="icons/Icon.png" />' 
}); 
0

はい。

$("ul li#key1").qtip(); //rest of code 

また、それはIDであり、おそらくユニークであるためです。あなたは、単に使用することができます。

$("#key1") 
2

ちょうどidセレクタを使用します。ページに一意である、などのすべての他のものを除外することはjQuery使用document.getElementByIDをすることができなければなりません

$("#key1").qtip(...); 

id値を、セレクタは構文解析して適用するのに素早く簡単です。 (あなたは、セレクタをファイルにしたい場合はkey1liない場合はもちろん、あなたは完全なセレクタを必要としています。しかし、通常、それはあなたが望むものではありません。)

注あなたid値の一部は、エスケープが必要になりますことを、その中に.があるからです。 .からエスケープするには、セレクタの前にバックスラッシュを置きます。セレクタは、JavaScriptの文字列であるあなたは2を使用するので、あなたは、実際にセレクタにバックスラッシュを得るためにバックスラッシュをエスケープする必要があるので:

$("#key4\\.1").qtip(...); 
0

あなたがidで選択している場合は、指定する必要はありません型、クラスまたは親クラス。 IDは一意でなければなりません。

あなたがそれらのすべてをまとめて選択したい場合の例として、あなたはKEY1、KEY2とKEY3を選択するには、次のセレクタを使用することができます。

$("#key1, #key2, #key3").qtip({ 
     content: '<img src="icons/Icon.png" />' 
    }); 

あるいはそれらを一つ一つを選択する:

$("#key1").qtip({ 
     content: '<img src="icons/Icon.png" />' 
    }); 

$("#key2").qtip({ 
     content: '<img src="icons/Icon.png" />' 
    }); 

それとも、Qティップの選択と初期化を繰り返してキーのリストを指定していないために、このような何かを行うことができます:

var keys = ['key1', 'key2', 'key3']; 

$(keys).each(function(i, key) { 
    $("#" + key).qtip({ 
     content: '<img src="icons/Icon.png" />' 
    }); 

});