如何检测单选按钮列表的更改

如何解决如何检测单选按钮列表的更改

|

<ul id=\'theList\'>
<li><input type=\'radio\' name=\'foo\' val=\'1\' /></li>
<li><input type=\'radio\' name=\'foo\' val=\'2\' /></li>
<li><input type=\'radio\' name=\'foo\' val=\'3\' /></li>
<li><input type=\'radio\' name=\'foo\' val=\'4\' /></li>
<li><input type=\'radio\' name=\'foo\' val=\'5\' /></li>
</ul>

当选择某些单选输入时，我想显示一个警报（\'hi \'）。 我尝试了这个：

$(function(){
   $(\'#theList input[type=\"radio\"]\').live(\'change\',function(){
      alert(\'hi\');
   });
});

它不起作用。 （我使用live是因为我通过ajax更改了ul的内容）     

解决方法

您的\'change \'事件处理程序可能未正确绑定。当您动态更改要绑定的元素时，live（）并不总是有效。 只是为了测试，请尝试ajaxComplete（） 就像是 ：

$(\'#theList\').ajaxComplete(function(){
   <!-- attach change event -->
});

    ,使用.die（），这样就不会将多个点击事件叠加到收音机中。同样，这是您需要的“ click”事件，而不是“ change”事件。

$(function(){
   $(\'#theList input[type=\"radio\"]\').die().live(\'click\',function(){
      alert(\'hi\');
   });
});

    ,您也可以在选中复选框的位置在ajax中使用.trigger（）。 我编写了一个示例，其中单击链接即可触发更改： jQuery的

$(\'#click\').click(function(){
    $(\'#theList input[val=\"2\"]\').click().trigger(\'contentchanged\')
});

$(\'#theList input[type=\"radio\"]\').bind(\'contentchanged\',function() {
  alert(\'hi\');
});

在jsfiddle上进行检查-http://jsfiddle.net/HQs8g/ 希望这对亚历克斯有帮助     ,您可以将事件绑定到父元素，这样，无论标签是在第一次加载时来自服务器还是在以后添加到DOM中，它都将捕获内部任何

input[type=\"radio\"]

标签的change事件。

$(function(){
   $(\'#theList\').on(\'change\',\'input[type=\"radio\"]\',function(){
      console.log(\"hi: \",$(this).val())
   });
});

另外，请注意，您的输入应设置为

value

属性而不是

val

。例如：

<input type=\'radio\' name=\'foo\' value=\'1\' />

    ,您可以尝试这个简单的jquery事件，该事件在用户单击单选按钮时触发。

 $(document).on(\'change\',\'#theList li input\',function() {
     alert(\'hi\');
   });

每当有人单击单选按钮时，都会触发此事件