jQueryセレクタの誤り

Question

「ラジオ」ボタンを選択するためにjQuery UIダイアログとjQueryを使用していました。

私は2つのダイアログを持っています.1つは「電卓」、もう1つは「expert_mode」です。

しかし、電卓の下で'input[value="simple"]'を選択すると、同じ名前のexpert_modeの下にあるinputにも影響します。修正方法は？

以下は私のコードです：

これは私のHTML（簡体字）である：

<div name="widget"> 
    <div name="calculator"> 
     <input name="mode" value="a" type="radio" **checked="checked"**/> 
     <input name="mode" value="b" type="radio"/> 
     <input name="mode" value="c" type="radio"/> 
    </div> 
    <div name="expert"> 
     <input name="mode" value="simple" type="radio"/> 
     <input name="mode" value="advanced" type="radio"/> 
     <input name="mode" value="custom" type="radio"/> 
    </div> 
</div> 

とJavaScript：

var widget=$('div[name="widget"]'); 
var calculator=widget.find('div[name="calculator"]'); 
var expert=widget.find('div[name="expert"]'); 

calculator.dialog(); 
expert.dialog(); 

その後、私はこれを行うとき：

expert.find('input[value="simple"]').attr('checked',true); 

次のようになります。

<div name="widget"> 
    <div name="calculator"> 
     <input name="mode" value="a" type="radio"/> ***Here, "checked" disappear!!*** 
     <input name="mode" value="b" type="radio"/> 
     <input name="mode" value="c" type="radio"/> 
    </div> 
    <div name="expert"> 
     <input name="mode" value="simple" type="radio" checked="checked"/> 
     <input name="mode" value="advanced" type="radio"/> 
     <input name="mode" value="custom" type="radio"/> 
    </div> 
</div> 

Answer 1

問題は、あなたのinput要素ではなく、あなたのjQueryのnameです。すべてのラジオボタンは同じ名前であるため、1つのグループとして扱われ、グループごとに1つのラジオボタンしかチェックされません。たとえば、ラジオボタンのセットのnameを変更する必要があります（簡略化）：

<div name="calculator"> 
    <input name="mode" value="a" type="radio"/> 
</div> 
<div name="expert"> 
    <input name="expertMode" value="simple" type="radio" checked="checked"/> 
</div>