如何取消选中具有相同类名但在应用jquery buttonset()之后的所有单选框

时间:2013-12-11 18:15:20

标签: javascript jquery html css

这是代码对我来说很好,但只有默认的HTML单选按钮控件

$('.block1').on("click", function(event){
  $('.block1').prop('checked', false);
  $(this).prop('checked', true);
});

http://sfiddle.net/bAhmed/zNq9R 但当我用$(“。col-lg-4”)更改单选按钮的默认UI时.buttonset();

然后上面的代码对我不起作用。因为它改变了行为或应用了jquery-ui.css和jquery.js的其他一些默认类

最终目标是取消选中.block1类的所有其他单选按钮,但在应用.buttonset()之后

1 个答案:

答案 0 :(得分:0)

从提供的信息中确切地说出你的问题到底有点困难,但在我看来,你的问题可能源于jQuery UI的buttonset函数所做的DOM重新排列。

您似乎正在挂钩之前直接在单选按钮输入元素上触发的'click'事件。在调用buttonset()之后,jQuery UI会折叠您在其上注册单击处理程序的输入元素,使其无法点击。因此,如果您想在调用buttonset函数后挂钩按钮组中的点击事件,则必须在 buttonset之后在另一组元素上注册处理程序功能已被调用。我建议使用jQuery UI创建的标签元素。您的代码可能如下所示:

$(function() {
  $(".col-lg-4")
      .buttonset()
      .find('label.ui-button')
      .on('click', function() {
    $('.block1').prop('checked', false).button('refresh');
    var targetId = '#' + $(this).attr('for');
    $(targetId).prop('checked', true).button('refresh');
  });
});

希望有所帮助!