做表单提交时,为了防止重复提交数据,在按表单提交按钮后,我会让按钮变成禁用状态,等提交后,如果出现错误的话,会后退到表单页面,可我发现用火狐浏览器的话,后退回来时或者刷新后,按钮仍然还是禁用状态。
在button
标签里加上autocomplete="off"
后,可以解决刷新后的禁用问题,可是后退依然解决不了
想到在pageshow
事件里把按钮启用
1 2 3 |
$(window).on("pageshow",function(){ $("button").prop("disabled",false); }); |
在beforeunload
事件里也行
1 2 3 |
$(window).on("beforeunload",function(){ $("button").prop("disabled",false); }); |
但是这样会产生一个问题,就是如果我一个页面某些按钮本来就是禁用状态的,我一刷新,全部都变启用了,要不就把你需要恢复状态的按钮单独地写出来,但这样是不是也太麻烦了。
终于让我发现一个更神奇的方法,如下面代码所示,这样只需在你需要会恢复的按钮上加上autocomplete="off"
属性,然后监听 beoreunload
事件,事件里也不用写任何代码就可以解决了,是不是很神奇。
1 2 3 4 5 6 |
<button type="button" autocomplete="off">自动恢复禁用状态的按钮</button> //为了解决火狐刷新后退按钮不恢复禁用状态 $(window).on("beforeunload",function(){ //这儿不用写任何代码 }); |