2016-07-20 9 views
0

私はこのようなラジオボタンを設定している:JavaScript/Ajaxでラジオボタンを切り替える簡単な方法は?

<hr /> 
<h2>PhoneyTV Cabana</h2> 
<p> 
    <input type="radio" id="phoneyRadio1" value="0" onclick="toggleParticlePower(phoneyID, phoneyPowerFunction, this.value)" name="led" />Off 
    <input type="radio" id="phoneyRadio2" value="1" onclick="toggleParticlePower(phoneyID, phoneyPowerFunction, this.value)" name="led" />On 
</p> 

これよりも自分のstatを更新する簡単な方法がなければならない:

$.getJSON(myURL, function(data) { 
    state = (parseInt(data.result) == 1) 
    if (state) { 
    $('#phoneyRadio1').attr('checked', false); 
    $('#phoneyRadio2').attr('checked', true); 
    } else { 
    $('#phoneyRadio2').attr('checked', false); 
    $('#phoneyRadio1').attr('checked', true); 
    } 
}); 

私はちょうど「アクティブ」ボタンが強調表示作ってみました、しかし私はそれに問題があります...

明らかなショートカットは何ですか?上記のコードで

+1

ラジオボタンをオンにすると、同じグループ内の他のラジオボタンが自動的にチェックされなくなります。 – JJJ

+0

私はあなたのコードを試しました、私は同様のアプローチを試みましたが、私はしばしばいずれも強調表示されていないバグを取得...おそらく他の何かがこの状態の変化を妨げている?これらの2つの行をラップして、原子的に実行する方法はありますか? –

+0

@JimfromPrincetonあなたは次のようなことをすることができます:[Updated Fiddle](https://jsfiddle.net/RajeshDixit/kecce3ac/1/) – Rajesh

答えて

0
if (state) { 
    $('#phoneyRadio1').attr('checked', false); 
    $('#phoneyRadio2').attr('checked', true); 
} else { 
    $('#phoneyRadio1').attr('checked', true); 
    $('#phoneyRadio2').attr('checked', false); 
} 

あなたが密接に観察する場合、phoneyRadio1の値は常に条件の反対であるとphoneyRadio2という単純なパターンが条件と同じです。だから、に減少させることができます。

$('#phoneyRadio1').attr('checked', !state); 
$('#phoneyRadio2').attr('checked', state); 

state = (parseInt(data.result) == 1)stateグローバル変数(varを逃す)を作成します。次に、data.resultをintに変換しているので、同じ型の値が一致するため、==の代わりに===を使用する必要があります。

var state = (parseInt(data.result) === 1)またはvar state = (+(data.result) === 1)のようになります。

Sample Fiddle

0

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

$.getJSON(myURL, function(data) { 
    state = (parseInt(data.result) == 1) 
    $('#phoneyRadio1').attr('checked', !state); 
    $('#phoneyRadio2').attr('checked', state); 
}); 
関連する問題