使用jQuery发布表单无法正常工作

时间:2011-09-29 23:10:36

标签: javascript jquery

我正在尝试从mail.php获取返回但它不起作用。我在这里缺少什么?

这是我的表格

<form name="myform" id="myform" action="" method="POST"> 
<input type="text" name="email" id="email" size="30" value=""/> 
<input type="submit" name="button" id="button" value="Αποστολή">
</form>

这是脚本

$(function() {
$("#myform").submit(function() {

$.post('mail.php', function(data) {
  $('#results').html(data); });
});
});

此脚本可以正常使用jQuery Validate

$(document).ready(function(){
    $("#myform").validate({

        submitHandler: function(form) {
            // do other stuff for a valid form
            $.post('mail.php', $("#myform").serialize(), function(data) {
                $('#results').hide().html(data).fadeIn('slow');
            });
        }
    });
});

3 个答案:

答案 0 :(得分:2)

$(function() {
   $("#myform").submit(function(event) {

        $.post('mail.php', function(data) {
            $('#results').html(data); });
        });

        event.preventDefault();
    });
})

取消表单提交,因为您已经在ajax中执行此操作。

更新

这是没有验证时的样子:

$(function(){
    $("#myform").submit(function(event){
        event.preventDefault();

        // do other stuff for a valid form
        $.post('mail.php', $("#myform").serialize(), function(data) {
            $('#results').hide().html(data).fadeIn('slow');
        });
    });
});

不同之处在于您从表单(包含$("#myform").serialize())发送序列化数据。在前面的代码中,您没有发送任何变量。序列化meangs它将采用表单的值并将它们连接成一个字符串。在此处详细了解:http://api.jquery.com/serialize/

答案 1 :(得分:2)

看起来您没有发送表单数据:

 $("#myform").submit(function(event) { 

     event.preventDefault(); 

     $.post("mail.php", $("#myform").serialize(), 
          function(data) {
            $('#results').html(data); 
     });


});

在ajax调用之前阻止默认行为会阻止表单在ajax出错或由于某种原因导致js停止时提交。

答案 2 :(得分:1)

$(function() {
    $("#myform").submit(function(e) {

        e.preventDefault();

        var data = $(this).serialize();

        $.post('mail.php', data, function(response) {
            $('#results').html(response);
        });

    });
});

您遇到语法错误,但未阻止默认点击事件。