hide（）ラジオボタン*と* jqueryのテキストラベル

Question

最近のプロジェクトでは、アクセシビリティの問題を整理し、すべてのフォーム要素にラベルが付いていることを確認しています。ラベルテキストをタグに入れておくと、前に書いたいくつかのクルージーコードに問題が生じました。基本的には

、あなたはラジオボタンとそのラベルがある場合：

<label for="zone_r1"><input type="radio" name="zone" id="zone_r1" value="NY" />New York</label> 

をそして、あなたがそうのようにそれを隠すためにjqueryのを使用します。

$('#zone_r1').hide(); 

実際のボタンが隠されているではなくラベルテキスト。もともと私は、ラベルテキストのスパンを作ったので、のようなことを隠した：

<input id="NY" type="radio" name="zone" value="NY" /><span id="nyTXT">New York</span> 

と

$('#NY').hide(); 
$('#nyTXT').hide(); 

任意のアイデア？私はkludgeを使用しないことを好み、ラベル内のスパンでは検証できないかもしれませんが、多分私は過度に熱心です。私

Answer 1

$('#zone_r1').parent().hide(); 

作品：第二のケースで

$('#zone_r1').hide().parent().hide(); 

をおボタンを非表示にすることができ、 "next"兄弟：

$('#NY').hide().next().hide(); 

Answer 2

何最初のラジオボタンの場合

Answer 3

$('label:has(#zone_r1)').hide();について、あなたはそのparent実際のボタンを非表示とすることができますため

Answer 4

私はこれがあなた

$("label[for=zone_r1],#zone_r1").hide(); 

のために働く必要があります。これは、あなたが探してラジオボタンに設定「の」属性だけでなく、ラジオボタン自体にラベルを選択し、それらの両方を隠しだと思います

Answer 5

あなたはこれを行うことができます。

1）周囲のラベルなしのラジオボタンの入力を定義します。

2.）<span>に「オプションテキスト」（ラジオボタンの右側にあるテキスト）を囲みます。

3）このjQueryのステートメントを使用します。$("input:radio:not(:checked), input:radio:not(:checked) + span").hide();

これは、ラジオボタンとラジオボタンの右にあるテキストを選択し、それを非表示になります。

Answer 6

親で

だけ入れる 'ラベル' セレクタ：

$(':radio[id=zone_r1]').parent('label').hide(); 

が値

のjQuery（ "入力[タイプ=ラジオ] [値に基づいて、ラジオボタンコンテナまたはTD隠れmy jsFiddle example

Answer 7

を参照してください。 = 'EU2'] "）。parent（）。隠す（）;