jQuery form.serialize返回一个空字符串

z18hc3ub  于 2023-08-04  发布在  jQuery
关注(0)|答案(1)|浏览(98)

我在提交事件中调用了一个表单的serialize,这样我就可以获得表单输入,然后阻止提交。我检查了所有的输入都有name值,并且在提交之前没有被禁用,但是.serialize仍然返回空字符串。任何帮助将不胜感激,谢谢!
我的代码的HTML在这里

div(class='waitlist' id='waitlist') 
            h1(id='waitlisttext') Add me to the waitlist
            form(action="" id='waitlistform')
                // target="_blank" method="POST" action="../waitlistdata.php"//
                label(for="fname") First name:
                br
                input(type="text", id="fname", name="fname", value="" required)
                br
                label(for="lname") Last name:
                br
                input(type="text", id="lname", name="lname", value="" required)
                br
                label(for="email") Email:
                br
                input(type="text" id="email" name="email" value="" required)
                br
                br
                input(type="submit" name="submit" value="Submit")

字符串
我的submit函数的JS在这里,在调用serialize之前检查输入是否被禁用,并返回序列化的字符串。

$("#waitlist").on("submit", function(e) {
    console.log('submit function called')

    console.log(document.getElementById('fname').disabled)
    var dataString = $(this).serialize();
    
    alert(dataString); return false; 
    $.ajax({
      type: "POST",
      url: "../views/waitlistdata.php",
      data: dataString,
      success: function () {
        $("#waitlisttext").html("<div id='message'></div>");
        $("#message")
          .html("<h2>Contact Form Submitted!</h2>")
          .append("<p>We will be in touch soon.</p>")
          .hide()
          .fadeIn(1500, function () {
            $("#message").append(
              "<img id='checkmark' src='images/check.png' />"
            );
          });
      }
    });
    e.preventDefault();
    return false;
  });

3npbholx

3npbholx1#

暂且不谈这不是HTML,假设它是其他一些语言,它会产生逻辑上类似的HTML……
您不是在序列化<form>,而是在序列化<div>。此事件处理程序:

$("#waitlist").on("submit", function(e) {

字符串
绑定到此元素:

div(class='waitlist' id='waitlist')


所以这是在尝试序列化那个元素:

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


也许你的意思是将事件绑定到<form>

$("#waitlistform").on("submit", function(e) {


或者,如果您仍然希望将事件处理程序绑定到<div>,则必须选择<form>来序列化它:

var dataString = $(this).find("form").serialize();

相关问题