Question

我有这样的按钮：

<button value="1" name="submit" disabled="true" id="signup-bb" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-disabled ui-state-disabled ui-button-text-only" role="button" aria-disabled="true">

点击该页面上的某些单选按钮后，“signup-bb”按钮可用

启用“signup-bb”按钮：

        $("signup-bb").removeAttr('disabled');
        $("signup-bb").attr('aria-disabled', false);
        $("signup-bb").removeClass('ui-button-disabled');
        $("signup-bb").removeClass('ui-state-disabled');

之后，我的按钮就像那样：

<button value="1" name="submit" aria-disabled="false" id="signup-bb" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button">

点击此按钮表单后发送到服务器，经过一些处理后，我重定向到另一个控制器，一切看起来都不错，但是如果我点击返回浏览器按钮我将按照我点击的按钮进入上一页（“signup-bb”）但此按钮处于禁用状态：

<button value="1" name="submit" disabled="true" id="signup-bb" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-disabled ui-state-disabled ui-button-text-only" role="button" aria-disabled="true">

当用户点击返回以显示之前的状态时，有任何想法如何解决这个问题吗？

Answer 1

发生这种情况的原因是，当首次加载页面时，按钮被禁用，这是页面存储在浏览器历史记录中的状态。然后，当单击单选按钮并启用signup-bb按钮时，您使用javascript对DOM进行了一些更改，但这些更改未保存到浏览器历史记录中。当用户单击后退按钮时，页面将从保存状态的历史记录中加载，即禁用该按钮。

Answer 2

我刚刚用来解决此问题的一种解决方法是重新启用卸载事件上的按钮：

(function ($) {
    // creates the jQuery UI button treatment for all button elements
    $('button').button();
    $(window).unload(function () {
        // re-enables the jQuery UI button treatment on all
        // button elements on the window unload event
        $('button').button('enable');
    });
})(jQuery);

返回浏览器历史记录后，按钮被禁用

2 个答案: