2016-11-10 2 views
0

私はjQueryにはあまりよくありません。この問題を解決するには問題があります。別の選択ボックスで特定の値を選択すると、選択したラジオボタンを変更する必要があります。jQuery選択ボックスのラジオボタンを変更する

<div class="radio-inline" id="sourceDiv" role="group"> 
 
\t <input type="radio" id="sourceBtns1" name="sourceBtn" class="btn btn-lg" value="CN"><label for="sourceBtns1">CHINA</label> 
 
\t <input type="radio" id="sourceBtns2" name="sourceBtn" class="btn btn-lg" value="ID" ><label for="sourceBtns2">INDONESIA</label> 
 
\t <input type="radio" id="sourceBtns3" name="sourceBtn" class="btn btn-lg" value="TH" ><label for="sourceBtns3">THAILAND</label> 
 
\t <input type="radio" id="sourceBtns4" name="sourceBtn" class="btn btn-lg" value="US"><label for="sourceBtns4">UNITED STATES</label> 
 
</div>

<div id="priceSelect"> 
 
<select name="priceSelect" id="priceSelect" class="form-control"> 
 
    \t <option value="FTLW">Domestic Full Truck Load</option> 
 
    \t <option value="PTLW">Domestic Partial Truck Load</option> 
 
    \t <option value="FTL" selected>International</option> 
 
    </select> 
 
</div>

私は "FTLW" オプションが選択ボックスで選択されている場合#sourceBtns4を選択するラジオボタンを取得しようとしています。

これは私が使用している機能です。私はエラーが出ないが、機能するようにはできない。私は問題が何であるか分かりません。私はいくつかの異なることを試しましたが、どれもうまくいきません。

提案がありますか?

$(document).ready(function() { 
 
\t $('#priceSelect').change(function(){ 
 
\t \t if($(this).val() == 'FTLW'){ 
 
\t \t \t $('#sourceBtns4').prop("checked", true); 
 
\t \t } 
 
\t }); 
 
});

答えて

1

あなたは同じidを持つ2つの要素を持つことができません。 divselectはともにidpriceSelectです。あなたが気にしているのはselectだけです。

$(document).ready(function() { 
 
\t $('#priceSelect').change(function(){ 
 
     console.log($(this).val()); 
 
\t \t if($(this).val() == 'FTLW'){ 
 
\t \t \t $('#sourceBtns4').prop("checked", true); 
 
\t \t } 
 
\t }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
<select name="priceSelect" id="priceSelect" class="form-control"> 
 
    \t <option value="FTLW">Domestic Full Truck Load</option> 
 
    \t <option value="PTLW">Domestic Partial Truck Load</option> 
 
    \t <option value="FTL" selected>International</option> 
 
    </select> 
 
</div> 
 
    <div class="radio-inline" id="sourceDiv" role="group"> 
 
\t <input type="radio" id="sourceBtns1" name="sourceBtn" class="btn btn-lg" value="CN"><label for="sourceBtns1">CHINA</label> 
 
\t <input type="radio" id="sourceBtns2" name="sourceBtn" class="btn btn-lg" value="ID" ><label for="sourceBtns2">INDONESIA</label> 
 
\t <input type="radio" id="sourceBtns3" name="sourceBtn" class="btn btn-lg" value="TH" ><label for="sourceBtns3">THAILAND</label> 
 
\t <input type="radio" id="sourceBtns4" name="sourceBtn" class="btn btn-lg" value="US"><label for="sourceBtns4">UNITED STATES</label> 
 
</div>

+0

うわー、私は本当のダム感じます。あなたはまさに正しいです。今はうまくいく。 –

+0

こんにちは@スコット、あなたはおそらく、私が午前よりも知識が豊富です。なぜ、あなたが.change()の代わりに.on( 'change'、...)を使うべきではないのですか?またはそれはちょうど選択ですか?私はon()が動的なイベントハンドリングのためであることを知っていますが、on()で常にハンドラを指定することに何らかの損害がありますか? – rob

+1

@rob jQueryのドキュメント(https://api.jquery.com/change/)では 'change()'は '.on(" change "、handler)'のショートカットです。 –

関連する問題