Использование ссылки для отправки формы в jQuery не будет работать

Question

У меня есть небольшая форма и ссылка, которая отправляет эту форму, используя jQuery и POST.Я хочу отобразить вывод HTML со страницы процесса на странице формы без обновления с помощью AJAX.Тем не менее, мой код не работает, когда я нажимаю на ссылку отправки.Пожалуйста, кто-нибудь может указать, что я могу делать здесь не так?Большое спасибо.

С уважением

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js">

</script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('#myform').submit(function() {
                $.post('demoprocess.php', $("#myform").serialize(), function(data) {
                    $('#results').html(data);
                });
            });
});
    </script>

<form name="myform" id="myform" action="" method="POST">  
    <label for="name" id="name_label">Name</label>  
    <input type="text" name="name" id="name" size="30" value=""/><br>>

    <label for="email" id="email_label">Email</label>  
    <input type="text" name="email" id="email" size="30" value=""/><br>

    <a href="#" title="" class="pay-button" style="margin-top:5px;" onclick="document.myform.submit()">SUBMIT</a> 
</form>

<!-- We will output the results from demoprocess.php here -->
<div id="results"><div>

Answer 1

Проблема в том, что вы связываете обработчик jQuery submit, но используете метод native DOM submit. Это не вызывает событие submit, поэтому обработчик jQuery никогда не уведомляется.

Вместо этого вы должны вызвать событие с помощью jQuery. Вероятно, проще всего сделать это в jQuery, а не использовать атрибут onclick:

$('.pay-button').click(function(e) {
    e.preventDefault(); // prevent the link's default behaviour
    $('#myForm').submit(); // trigget the submit handler
});

Обратите внимание, что это не очень хороший дизайн, IMO, потому что пользователи без Javascript не смогут отправить вашу форму.

Answer 2

Проблема в том, что ваша форма не содержит элементов, которые запускают javascript submit событие

Из документации jquery .submit():

Событие submit отправляется элементу, когда пользователь пытается отправить форму.Он может быть прикреплен только к элементам.Формы могут быть отправлены либо нажатием явной <input type="submit">, <input type="image"> или <button type="submit">, либо нажатием Enter, когда определенные элементы формы имеют фокус.

Итак, чтобы сделать .submit() Работы, которые вам нужно добавить один из:

• <input type="submit">,
• <input type="image">,

• или <button type="submit">.

  к вашей форме, поэтому вам нужно будет добавить что-то вроде:

  <input type="submit" />
  

Answer 3

Попробуйте запретить поведение по умолчанию при отправке формы:

$('#myform').submit(function(ev){
    ev.preventDefault();
    $.post('demoprocess.php', $("#myform").serialize(), function(data) {
        $('#results').html(data);
    });
});

Answer 4

Вы можете сделать:

document.forms[0].submit()

или

$('#myform').submit();