、みんなはクラスを使用すると述べています- あの人達の話を聞いて!はるかに簡単です!
しかし、HTMLコンテンツを変更することは、単にオプションではない場合があります。その場合、いくつかの汚い作業に頼らざるを得ず、対応するチェックボックスを見つけるためにラベル要素に含まれるすべてのテキストを見る必要があります。
var selectedCheckboxes = [];
$.each($("#container > label"),function(index,elem){
var labelText = $(elem).text();
var testString = "Workshops";
if (labelText.match(testString)){
selectedCheckboxes = $(elem).find("input[type='checkbox']:checked");
}
});
私は、マークアップが少し複雑(自分のテキストの内容と追加の子要素のように)である場合、このメソッドはしなければならないが、このソリューションは、あなたが与えた簡単な例のために働くということを警告しなければなりませんもっと大きくなり、より複雑になります。
HTMLマークアップ内の要素のテキストコンテンツと一致するセレクタがありません。要素のテキスト内容は、データまたは情報の視覚的な表現でなければなりません。アイデンティティ情報を含むべきではありません。要素とセットを識別するには、兄弟や子孫から離れて、id
とclass
の属性を使用します。より多くのものが使用できますが、これらは基本的なビルディングブロックです。
ここで注意すべきことは、jQueryの.text()
機能の動作です。それは以下となります。
はその子孫を含むマッチした要素の集合、の各要素の組み合わせテキストの内容を取得します。
重点は:contains()
セレクタは子孫に関して同様の挙動を有し、前の回答でalready been coveredを有する
を加えました。
:
<div id="matt">
One
<span>Two</span>
<div>
<label>Three</label>
</div>
Four
</div>
が$("#matt").text()
への呼び出しがもたらすであろう。この最小限のHTMLスニペットを考えると、よりハンズオンとこの制限の視覚的な例にオン
...
子孫のテキストコンテンツが同様に含まれるすべての...
出典
2012-04-12 14:03:10
Lix
は、ラベルの有効なHTMLでチェックボックスをラップされていますか? – JeffSahol
@JeffSaholそれは有効であるだけでなく、より大きなヒット領域を与えるので、非常に良い方法です。 –