为什么这个代码显示异常行为?(未提交表格）

Why is this code showing anomalous behaviour? (form not submitted)

本文关键字：提交 表格 代码 显示 异常 为什么      更新时间：2023-09-26

我正在尝试使用PHP和Ajax提交表单。但问题是，有时它插入一个值，有时插入2，有时插入全部，而现在它什么都不插入。为什么会这样？我该如何更正？

这是我的代码：Ajax

$(document).ready(function(){
$("button").click(function(){
$.ajax({
    url: "submitform.php",
    type: "POST",
    data: $("form").serialize(),
    success: function(data){
        alert("well");
    },
    error: function(){
            alert("Error");
            }
        });
    });
 });

HTML

<form id="signupform" name="form1" method="post" enctype="multipart/form-data">
                    <table>
                      <tr>
                        <td><input type="text" name="name" placeholder="Enter your name" required /></td>
                        <td rowspan="3"><div class="propic"><img id="imgid" src="images/dp.png" /></div>
                          <input id="imgInput" type="file" name="image"/></td>
                      </tr>
                      <tr>
                        <td><input type="text" name="username" placeholder="Enter username" required /></td>
                      </tr>
                      <tr>
                        <td><input id="digits" type="text" name="phone" maxlength="10" placeholder="Enter your phone no." required /></td>
                      </tr>
                      <tr>
                        <td><input type="password" name="password" maxlength="12" placeholder="Enter password" required /></td>
                        <td><input id="button" type="submit" name="submit" value="Sign Up" /></td>
                      </tr>
</table>
</form>

PHP

<?php
$conn=mysqli_connect("localhost", "root", "", "winkcage");
//$im=$_SESSION["pathsession"];
$nam=""; $usernam=""; $phon=""; $pass="";
$nam=$_POST["name"];
$usernam=$_POST["username"];
$phon=$_POST["phone"];
$pass=$_POST["password"];
$signquery="INSERT INTO signup(name, username, phone, password) VALUES('$nam', '$usernam', '$phon', '$pass')";
$signqueryrun=mysqli_query($conn, $signquery);
?>

注意：我现在不想插入图像值。这个问题解决后我会插入它。

您可能输入了一个'引号，它终止了您的sql语句。这称为sql注入。为了防止sql注入，可以使用pdo-prepared语句。你还需要散列密码，以防止人们在访问你的数据库时窃取密码。哈希密码是一种易于检查的单向加密。

$pdo = new PDO("mysql:host=$db_host;dbname=$DB_name", $user, $pass);
$sql = "INSERT INTO signup(name, username, phone, password) VALUES(':name', ':username', ':phone', ':pass')";
if ($con = $pdo->prepare($sql)) {
    $con->execute([
        ':name' => $_POST["name"],
        ':username' => $_POST["username"],
        ':phone' => $_POST["username"],
        ':pass' => $_POST["password"]
    ]);
}

就html和javascript而言。使用jquerys的.submit()函数捕获提交的表单。

$('form').submit(function(e){
        e.preventDefault();
        $.post('submit.php',$(this).serialize(),function(response){
            alert('complete');
        }).error(function(){
            alert('wrong');
        });
    });

这确保了比任何提交事件都能触发ajax。

由于您使用的表单带有提交按钮，当您单击该按钮时，它将提交表单。您可能在AJAX操作和表单提交之间存在冲突。尝试阻止按钮上的默认操作点击，看看它是否按如下方式工作：

$(document).ready(function(){
$("#button").click(function(event){
if($("form").get()[0].checkValidity()){
  $.ajax({
      url: "submitform.php",
      type: "POST",
      data: $("form").serialize(),
      success: function(data){
          alert("well");
      },
      error: function(){
              alert("Error");
              }
          });
      });
    }
    event.preventDefault();
 });

您将onclick分配给一个按钮元素，但页面上没有按钮元素，您的按钮是一个输入元素。把它改成一个按钮，它可能会工作。我个人建议使用id，而不是元素类型，我认为这会让事情变得更清楚，并允许您在不破坏代码的情况下拥有多个相同类型的元素。

更改

$("button").click(function(){

至

$("#button").click(function(){

和

data: $("form").serialize(),

至

data: $("#signupform").serialize(),
相关文章：