jQuery' .click(回调)'防止默认事件

时间:2015-01-22 14:45:35

标签: javascript jquery forms javascript-events event-propagation

我正在尝试阻止双击表单按钮,禁用该元素几秒钟。

<form action="#" method="POST">
    <input type="text" />
    <input type="password" />
    <button class="myButton" type="submit">Send</button>
</form>


var that = this;
this.element = $(".myButton");
this.element.click(function(e) {
    this.element.prop("disabled", true);
    window.setTimeout(function() {
        that.element.prop("disabled", false);
    }, 2000);
});

成功启用/禁用,但使用.click()功能会阻止(自动?O_o)事件的传播,而页面不会跟随中的链接表单操作属性。

注意 我正在尝试将行为添加到以前完美运行的表单按钮(POST到 aciton 链接)。 此外,启用/禁用工作也很完美(无论我在上述代码的调整中可能出现的最终错误)。

PS - 任何解决方案都必须跨浏览器并与IE8兼容。

1 个答案:

答案 0 :(得分:5)

通过禁用该按钮,您可以阻止发布后期操作。所以你想要做的是禁用表单,然后使用javascript调用实际提交表单。这看起来像这样:

$('.myButton').click(function() {
    $button = $(this);
    $button.attr('disabled', true);
    $button.closest('form').submit();
    setTimeout(function() {
        $button.attr('disabled', false);
    }, 2000);
});