php javascript表单序列化获取数据未定义索引

我想从javascript调用输入值 我的主页代码：

<form method="post" id="form">
                  <div class="row">
                    <div class="col-md-6">
                      <label for="f_name">First Name</label>
                      <input type="text" class="form-control" name="f_name "id="f_name" value="">
                    </div>
                    <div class="col-md-6">
                      <label for="l_name">Last Name</label>
                      <input type="text" class="form-control" name="l_name" id="l_name" value="">
                    </div>
                  </div>

<?php

include "db.php";

    $fname = $_POST["f_name"];
    $lname = $_POST["l_name"];
...
echo $fname;

…调用页面代码：

<form method="post" id="form">
                  <div class="row">
                    <div class="col-md-6">
                      <label for="f_name">First Name</label>
                      <input type="text" class="form-control" name="f_name "id="f_name" value="">
                    </div>
                    <div class="col-md-6">
                      <label for="l_name">Last Name</label>
                      <input type="text" class="form-control" name="l_name" id="l_name" value="">
                    </div>
                  </div>

<?php

include "db.php";

    $fname = $_POST["f_name"];
    $lname = $_POST["l_name"];
...
echo $fname;

…单击按钮时出错，仅定义了姓氏输入值

<br />
<b>Notice</b>:  Undefined index: f_name in <b>D:\xampp\htdocs\shop\register.php</b> on line <b>5</b><br />
<br />
<b>Notice</b>:  Undefined index: email in <b>D:\xampp\htdocs\shop\register.php</b> on line <b>7</b><br />
<br />
<b>Notice</b>:  Undefined index: password in <b>D:\xampp\htdocs\shop\register.php</b> on line <b>8</b><br />

谁能帮帮我？

---

我在这上面坚持了4个多小时。我正在学习javascript n php，n仍然是新手。请帮忙。谢谢。

您的第一个输入字段中也有一个错误

<input name="f_name ">

shouldbe

<input name="f_name">

$("#singup_btn").click(function(event){
    event.preventDefault();
    $.ajax({
        url     : "register.php",
        method  : "POST",
        data    : $("#form").serialize(),
        success : function(data){
            alert(data);
        }
    })
})

试试这个代码

$(document).on('click', '#singup_btn', function() {
    $.ajax({
        url     : "register.php",
        type    : "POST",
        data    : $("#form").serialize(),
        success : function(data){
            alert(data);
        }
    });
});

---

请从提交按钮中删除type=submit并添加type=button。它会成功的

使用name=f_name id=f_name中的空格序列化表单时，将强制将+附加到序列化值。这就是为什么服务器端无法正确拾取它的原因

期望的服务器端值

实际服务器端值

见下面的测试

$button.clickfunction { //序列化前的输出值 f_名称的console.log结果； console.log$f_name.val； l_名称的console.log结果； console.log$l_name.val； //序列化后的输出值 var serialized=$form.serialize； log Result：注意f_name在其键中是如何附加+的； console.log“+序列化+”； }; 名字 姓 测验

---

发送ajax请求时，请检查控制台。您可以知道数据是否随请求一起发送。如何做，先生？@BillyAlfredo在您的浏览器中打开开发人员工具通常仅在windows上的f12，并检查控制台选项卡中的js错误。另请检查“网络”选项卡，查看请求中传递给服务器的内容。@MasterYoda控制台中没有js错误，只有一些css…这是第一个输入字段中的错误，我已更新了答案。将方法更改为键入also@Chris它仍应拾取元素，而不将Id作为选择器。仍然存在相同的错误，n我不认为javascript是这里的问题，也许？因为我可以叫姓氏值，但其他值不能。。idk why..更新了我的答案，发现了另一个bug-你也应该说，首先它会帮助更快地调试它。简单易做，很高兴它得到了解决：如果你刚开始开发，我可以建议你自己买一个IDE吗？它可以帮助消除许多bug，以免它们与许多其他功能一起成为问题。我使用Netbeansno，仍然得到相同的错误。仅定义姓氏输入值。其他未定义。

f_name+=asd&l_name=asd