Не удается перехватить форму отправки события

Question

Я пытаюсь использовать jQuery для отправки формы, чтобы не нужно было перезагружать страницу, хотя я не могу подключить ее к форме.

<form action="index.php" method="get" id="frmFilter">

и

$("#frmFilter").submit( function () {
    alert('t');
    return false;
});

Это просто не будет работать, хотя; когда я использую кнопку отправки в форме, она отправляется вместо отображения предупреждения.

Форма на самом деле загружается с помощью события jQuery .load, и я попытался поместить вышеуказанный код на страницу вместе с формой, а также на страницу, которая загружает форму, и то и другое не будет работать.

Есть идеи, что я делаю не так?

Протестировано с использованием IE8 и Chrome 3.

Answer 1

Вы упомянули, что вы выгружаете форму на свою страницу с помощью метода jquery load. Это означает, что любой тип submit обработчика событий, запущенного на «родительской странице» document.ready, уже будет запущен к тому времени, когда ваш load завершит свою работу. Что вам нужно сделать, это найти способ прикрепить это событие после загрузка завершена ... Я могу предложить два способа:

Один, на вашей "родительской странице", прикрепите событие после завершения загрузки в обратном вызове. Например:

$('#sometarget').load('someform.php', function() {
    // this is the load "complete" callback. attach events in here.
    $("#frmFilter").submit( function () {
        alert('t');
        return false;
    });
});

Другая идея заключается в том, чтобы поместить этот сценарий в «someform.php» (или как вы его называете!), Но как часть документа, а не в его заголовок или собственный «document.ready». (Помните, что document.ready уже давно запущен, поэтому что-либо в собственном «document.ready» этой страницы «someform» никогда не увидит дневного света, когда вводится через load ...)

РОДИТЕЛЬНАЯ СТРАНИЦА

$('#sometarget').load('someform.php');

ФОРМАТНАЯ СТРАНИЦА

<form action="index.php" method="get" id="frmFilter">
    <input type="..." />
    <input type="..." />
</form>
<script type="text/javascript">
$("#frmFilter").submit( function () {
    alert('t');
    return false;
});
</script>

Удачи!

Answer 2

В вашем обратном вызове:

$("#frmFilter").submit( function (e) {
    e.preventDefault();
    alert('t');
    return false;
});