Question

我正在使用this控件，这是jquery智能向导的第3版。

这是智能向导的代码：

$('#wizard').smartWizard({transitionEffect:'slide'});

这是javascript中的辅助函数：

function disableNextButton(){
    var $actionBar = $('.actionBar');
    $('.buttonNext', $actionBar).addClass('buttonDisabled').off("click");
}

function enableNextButton(){
    var $actionBar = $('.actionBar');
    $('.buttonNext', $actionBar).removeClass('buttonDisabled');
}

css类actionBar用于设置放置上一个，下一个和完成按钮的区域的样式。样式buttonNext应用于下一个按钮，样式buttonDisabled用于将灰色颜色应用于按钮。所有引用的样式都包含在智能向导css文件中。

问题是我可以使用jquery的“.off”功能禁用按钮点击事件，但我无法使用“.on”恢复原始事件处理程序。

我的问题是如何在禁用按钮后恢复下一次按钮点击事件？

感谢。

Answer 1

.off取消链接事件处理程序，因此您需要重新附加事件处理程序。你不能只说

$('.buttonNext', $actionBar).removeClass('buttonDisabled').on("click");

因为jQuery不“记住”事件是什么，或者如果你有多个事件，你想要绑定哪个事件。您可以使用单击速记来指定如下函数：

$('.buttonNext', $actionBar).removeClass('buttonDisabled').click(function() {
  // Code for your click goes here.
});

Answer 2

在阅读了jquery smartwizard的代码之后，我决定对enableNextButton函数执行以下操作：

function enableNextButton($wiz){
    var $actionBar = $('.actionBar');
    $('.buttonNext', $actionBar).removeClass('buttonDisabled')
            .bind('click', function() {
                $wiz.smartWizard('goForward');
                return false;
            });
}

jquery向导对象作为参数传递。

这解决了恢复点击功能的问题，尽管从智能向导重复代码。

在jquery智能向导控件上启用/禁用按钮单击事件

2 个答案: