Question

我尝试了this。所以，当我点击单选按钮时，代码可以工作，但是单选按钮没有被检查，它仍然正常。怎么解决这个问题？

<p>
    <input id="play" class="rad" type='radio' name='a'/>
    <input id="pause" class="rad" type='radio' name='a'/>
</p>

var output = $('h1');
var isPaused = false;
var time = 30;
var t = window.setInterval(function () {
    if (!isPaused) {
        time--;
        output.text("0:" + time);
    }
}, 1000);

//with jquery
$('.pause').on('click', function (e) {
    e.preventDefault();
    isPaused = true;
});

$('.play').on('click', function (e) {
    e.preventDefault();
    isPaused = false;
});

Answer 1

一些事情：

您的选择器错误： $('.pause')应为$("#pause")或$(".rad")

此外，您在e.preventDefault()内呼叫click。这样可以防止点击单选按钮的默认行为，即检查它。

Updated jsFiddle感谢您想要您尝试实现的目标，即让单选按钮成为您计时器的切换按钮：

var output = $('h1');
var isPaused = false;
var time = 30;
var t = window.setInterval(function() {

    if(!isPaused) {
        time--;
        output.text("0:" + time);
    }
}, 1000);

//with jquery
$('#pause').on('click', function(e) {
    isPaused = true;
});

$('#play').on('click', function(e) {
    isPaused = false;
});

Answer 2

$("input[type=radio]").change(function(){

   if(this.checked) 
   {
     alert("checked");
   }

});

如果您的单选按钮的ID为play，则直接使用#play作为选择器，即$("#play").change()。

Answer 3

<input id="play" class="rad" type='radio' name='a' value="1"/>
    <input id="pause" class="rad" type='radio' name='a' value="2"/>

var output = $('h1');
var isPaused = false;
var time = 30;
var t = window.setInterval(function() {
    if(!isPaused) {
        time--;
        output.text("0:" + time);
    }
}, 1000);

//with jquery
$('.rad').on('change', function(e) {
    e.preventDefault();
    if(this.value=='2')
    isPaused = true;
    else
        isPaused = false;
});

fiddle

如何在jQuery中检查单选按钮时触发事件

3 个答案: