Ajax表单提交无效

Question

我有一个简单的反馈表，如下所示，它使用图像作为提交按钮而不是标准的HTML提交按钮。 表单似乎提交但“data：”值始终为NULL。 我究竟做错了什么？ 代码如下。

表格：

<div id="theResponse" class="ContactForm"></div>
    <label><span class="footer_text_2"> Email</span> </label>
    <br />
    <form name="contact" method="post" action="">
      <input name="txtEmail" type="text" class="contact" id="txtEmail" value="" />
      <span class="footer_text_2"> Message</span>
      <textarea name="txtComment" cols="18" rows="3" class="contact" id="txtComment"></textarea>
      <input name="Id" type="hidden" id="Id"  value="1"/>
      <input name="input" type="image"  id="ContactSubmit" src="images/btn_send.png" width="60" height="22"/>
    </form>

JQUERY代码：

$(document).ready(function(){
  //Bind the click event for the login button
$("#ContactSubmit").bind("click", function(){ });
// The click event for button click
$('#ContactSubmit').click(function() {
       $.ajax({
            type: "POST",
            url: "MyAccount/ProcessContactForm.asp",
            data:  $("#contact").serialize(),
            cache: false,
            dataType: "html",
            success: function(responseText){
                $("#theResponse").html(responseText);
            },
        });
    return false;
});
 });
</script>

Answer 1

尝试

form缺少id="contact"

<form name="contact" method="post" id="contact" action="">

---

或者使用当前的form html

 data: $('form[name="contact"]').serialize(), 

Answer 2

在这一行：

data:  $("#contact").serialize(),

您正在选择ID。

你应该改变这一行：

<form name="contact" method="post" action="">

至

<form id="contact" method="post" action="">

Answer 3

$("#contact").serialize()

如果您没有为表单元素设置“id”属性，则此方法无效。

其余的还可以，应该正常工作:)