Событие клика на кнопках отправки срабатывает только один раз

Question

Я подписываюсь на событие click на всех кнопках отправки на моей странице после загрузки. Все кнопки запускают правильное событие при нажатии, но это работает только один раз. Если вы нажмете любую из двух кнопок подряд, вторая кнопка отправит форму, как правило, вместо запуска скрипта. Что я делаю не так?

Примечание: я загружаю данные формы из "myurl", используя .load(), затем подключаюсь к событиям нажатия кнопок отправки в завершенном событии.

$(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, что делает его работающим даже при перезагрузке контента и замене кнопки отправки.