文章/答案/技术大牛

发布

社区首页 >问答首页 >在HTML按钮上放置事件处理程序而不覆盖其默认功能？

问在HTML按钮上放置事件处理程序而不覆盖其默认功能？
EN

Stack Overflow用户

提问于 2013-12-06 03:29:11

回答 2查看 62关注 0票数 1

我正在尝试修改一个联系人表单，以便在单击提交按钮后禁用5秒钟，以防止意外的重复提交。

问题是禁用按钮(通过设置它的“disabled”属性)会阻止它实际提交。在它们上设置任何类型的even处理程序似乎都覆盖了默认操作，即使我没有使用.preventDefault()；。

有没有一种方法可以将单击事件处理程序绑定到按钮，该按钮将在现有功能之外进行操作？

下面是我使用的代码：

 jQuery(function() {
    jQuery(":submit").on('click', function(e) {
        jQuery(this).attr('disabled','disabled');
    });
 });

javascript

jquery

回答 2

Stack Overflow用户

发布于 2013-12-06 03:53:25

演示：http://jsfiddle.net/souviiik/4AsHc/

HTML

<form action="#" id="myForm">
    <input type="text">
    <input type="submit" value="Submit" class="btnSubmit">
</form>

JQUERY

var st;

$("#myForm").on("submit", function () {
    if ($(".btnSubmit").hasClass("btnDisabled")) {
        return false;
    } else {
        alert("clicked!");
        $(".btnSubmit").addClass("btnDisabled");
        st = setInterval(enableBtn, 5000);
    }
});

function enableBtn() {
    $(".btnSubmit").removeClass("btnDisabled");
    clearInterval(st);
}

CSS

.btnSubmit {
    background: #d33;
    color: #FFF;
    border: 1px solid #d33;
}
.btnDisabled {
    background: #fefefe;
    color: #aaa;
    border: 1px solid #aaa;
}

票数 0

Stack Overflow用户

发布于 2013-12-06 04:32:01

如果只想使用提交按钮一次，可以使用jquery .one()函数

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/20408843

复制

相似问题

问在HTML按钮上放置事件处理程序而不覆盖其默认功能？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在HTML按钮上放置事件处理程序而不覆盖其默认功能？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在HTML按钮上放置事件处理程序而不覆盖其默认功能？
EN