Ajax表单提交不起作用

Ajax Form Submit is not working

本文关键字：不起作用 表单提交 Ajax      更新时间：2023-09-26

我有一个简单的反馈表单，如下所示，它使用图像作为提交按钮，而不是标准的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>

查询代码：

$(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>

尝试

form 中缺少id="contact"

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

或将其与您当前的form html 一起使用

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

在行中：

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

您正在选择id。

您应该更改这一行：

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

至

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

$("#contact").serialize()

如果不为表单元素设置"id"属性，这将不起作用。

其余的都可以，应该可以正常工作：）

相关文章：