2

私はこの設定をしています:

<style>.selectit{display:none;}</style>
<div id="foo">
<label class="selectit">
<input type="checkbox" name="one" id="one" checked>
One
</label>
<label class="selectit">
<input type="checkbox" name="two" id="two">
Two
</label>
<label class="selectit">
<input type="checkbox" name="three" id="three" checked>
Three
</label>
</div>

チェックされた入力のラベルタグのみを表示し、他の入力のラベルを非表示にします。

チェックされた入力ラベルの場合はshow()、チェックされていないものの場合はhide()のようなものです。

動作するコードの例:

<style>.selectit{display:none;}</style>
<div id="foo">
<label class="selectit" style="display:block">
<input type="checkbox" name="one" id="one" checked>
One
</label>
<label class="selectit">
<input type="checkbox" name="two" id="two">
Two
</label>
<label class="selectit" style="display:block">
<input type="checkbox" name="three" id="three" checked>
Three
</label>
</div>

または、おそらく、新しいdivを作成し、そのdiv内のチェックされたラベルのテキストのみを表示します。

<style>.selectit{display:none;}</style>
<div id="foo">
<label class="selectit">
<input type="checkbox" name="one" id="one" checked>
One
</label>
<label class="selectit">
<input type="checkbox" name="two" id="two">
Two
</label>
<label class="selectit">
<input type="checkbox" name="three" id="three" checked>
Three
</label>
</div>
<div id="output">One - Three</div>

これも可能ですか?または、チェックボックス全体を検索するdivを追加してこれを行う必要がありますか?私はすでにすべてのオプションを使い果たしており、アイデアがないので、どんな助けでもありがたいです。前もって感謝します。

4

2 に答える 2

3

filterメソッドを使用して、チェックされたチェックボックスをフィルタリングできます。

$('#foo input[type=checkbox]').filter(function(){
      return this.checked;
}).prev('label').show();
于 2013-01-20T00:50:41.387 に答える
2

免責事項:この回答は、タイトルの質問に基づいています


そのためには純粋なCSSを使用します。好き

label {
    display: none;
} 

input:checked + label {
    display: block;
} 

マークアップを少し調整する必要があります。

例: http: //jsfiddle.net/ZpmGd/

于 2013-01-20T01:01:14.303 に答える