Question

我正在使用jQuery UI buttonset来打开/关闭一对按钮，这主要是因为它带来了漂亮的样式。我想处理点击，这样当你点击两个按钮中的一个时，你会得到一个对话框，在那里你可以做出更多选择，之后页面会重新加载按钮处于新状态（如果状态被改变，可能不会是这样的。）

问题是，在调用任何点击处理程序之前，您单击的按钮的样式将被选中。我不希望选择改变，我想手动完成。

似乎click事件绑定到jQuery UI创建的标签，我正在努力解决它的问题。我想我也问是否有其他方法来获得没有该功能的风格...因为buttonset不提供任何事件处理程序，我需要自己捕捉点击事件。

我现在想到的解决方案就是将buttonset生成的html复制到我的代码中，保留css并删除buttonset调用。我认为在放弃之前检查StackOverflow可能是值得的。：）

Answer 1

由于jQuery UI不会触发任何以前运行的事件，因为实际选择是完成此操作的变通方法会相对比较hacky。我能想到的最好的想法是以编程方式记住以前选择的选项，然后附加一个click处理程序，确定是否应该还原jQuery UI对新按钮的选择。

$('#parent_container').buttonset();
var selectedButton = $('#parent_container :checked');
$('.ui-button').on('click', function() {
    setTimeout(function() {
        //Insert your actual check here.
        if (true) {
            selectedButton.attr('checked', true);
            $('#radio').buttonset('refresh');
        } else {
            selectedButton = $('#parent_container :checked');
        }
    }, 1);
});

setTimeout是确保在jQuery UI的点击处理程序之后运行的必要条件。由于您正在显示一个对话框，您可能需要对其进行更改以立即恢复选择，但请记住用户尝试选择以供将来使用的内容。

我有一个总是拒绝用户选择的例子 - http://jsfiddle.net/tj_vantoll/s6XTu/14/

显然这不是一种理想的方法，但确实有效。 jQuery UI应该真正添加对选择事件的支持;我会试着为此归档一张票。该按钮插件将在1.11 - http://wiki.jqueryui.com/w/page/12138038/Roadmap中进行一些更新。

jQuery buttonset：拦截点击次数，使按钮不会改变状态

1 个答案: