如何使用收音机更改事件？

我有两个单选button，更改事件我想更改button如何可能？ 我的代码

<input type="radio" name="bedStatus" id="allot" checked="checked" value="allot">Allot <input type="radio" name="bedStatus" id="transfer" value="transfer">Transfer 

脚本

 <script> $(document).ready(function () { $('input:radio[name=bedStatus]:checked').change(function () { if ($("input[name='bedStatus']:checked").val() == 'allot') { alert("Allot Thai Gayo Bhai"); } if ($("input[name='bedStatus']:checked").val() == 'allot') { alert("Transfer Thai Gayo"); } }); }); </script> 

这些脚本仅工作Allot单选buttonselect只

Answer 1

你可以使用this引用当前input元素的东西。

 $(document).ready(function() { $('input[type=radio][name=bedStatus]').change(function() { if (this.value == 'allot') { alert("Allot Thai Gayo Bhai"); } else if (this.value == 'transfer') { alert("Transfer Thai Gayo"); } }); }); 

http://jsfiddle.net/4gZAT/

请注意，您将在if语句和:radio已被弃用的情况下比较该值。

如果你不使用jQuery，你可以使用document.querySelectorAll和HTMLElement.addEventListener方法：

 var radios = document.querySelectorAll('input[type=radio][name="bedStatus"]'); function changeHandler(event) { if ( this.value === 'allot' ) { console.log('value', 'allot'); } else if ( this.value === 'transfer' ) { console.log('value', 'transfer'); } } Array.prototype.forEach.call(radios, function(radio) { radio.addEventListener('change', changeHandler); }); 

Answer 2

上述答案的改编

 $('input[type=radio][name=bedStatus]').on('change', function() { switch($(this).val()) { case 'allot': alert("Allot Thai Gayo Bhai"); break; case 'transfer': alert("Transfer Thai Gayo"); break; } }); 

http://jsfiddle.net/xwYx9/

Answer 3

一个更简单更清洁的方法是使用@ Ohgodwhy的答案

 <input ... class="rButton"> <input ... class="rButton"> 

脚本

 ​$( ".rButton" ).change(function() { switch($(this).val()) { case 'allot' : alert("Allot Thai Gayo Bhai"); break; case 'transfer' : alert("Transfer Thai Gayo"); break; } });​ 

Answer 4

 $(document).ready(function () { $('#allot').click(function () { if ($(this).is(':checked')) { alert("Allot Thai Gayo Bhai"); } }); $('#transfer').click(function () { if ($(this).is(':checked')) { alert("Transfer Thai Gayo"); } }); }); 

JS小提琴