Question

我订阅了页面上所有提交按钮的点击事件。单击时所有按钮都会触发正确的事件，但这仅适用一次。如果单击一行中的任意两个按钮，则第二个按钮会正常提交表单，而不是运行脚本。我做错了什么？。

注意：我使用.load()从“myurl”加载表单数据，然后在完整事件中连接到提交按钮的单击事件。

$(document).ready(function()
{
    //Load user content
    $("#passcontent").load("myurl", function()
    {
        //subscribe to click events for buttons to post the data back
        $('input[type=submit]').click(function()
        {
            return submitClick($(this));
        });
    });
});

function submitClick(submitButton)
{
    submitButton.attr("disabled", true);

    alert(submitButton.closest("form").serialize());
    $.post("myurl",
            submitButton.closest("form").serialize(),
            function(data)
            {
                alert("woop");
                $("#passcontent").html(data);
            });

    //Prevent normal form submission process from continuing
    return false;
}

Answer 1

我会像这样重新排列你的点击处理程序：

$(function() {
  $("#passcontent").load("myurl");

  $('input[type=submit]').live('click', function() {
    $(this).attr("disabled", true);        
    $.post("myurl", $(this).closest("form").serialize(), function(data) {
       $("#passcontent").html(data);
    });
    return false;
  });
});

使用.live('click', func)侦听当前和新元素'click事件，因为它们以相同的方式冒泡DOM。通过执行上述操作，您将在DOM的根目录附加一个处理程序，以便监听任何input[type=submit]以使click冒泡，即使您重新加载内容并更换提交按钮也能使其正常工作

提交按钮上的Click事件仅触发一次

1 个答案: