在这种情况下，如何将数据从 html 传输到 php

Question

<div id="background">
  <div class="form-group">
    <label for="usr" style="position:fixed;margin-top:180px;margin-left:900px;"><u>Account ID</u>:</label>
    <input type="text" placeholder="Enter your ID in here" class="form-control" id="usr" style="position:absolute;width:350px;margin-top:205px;margin-left:900px;">      
  </div>
  <div class="form-group">
    <label for="pwd" style="position:fixed;margin-top:230px;margin-left:900px;"><u>PIN</u>:</label>
    <input type="password" placeholder="Enter your PIN in here" class="form-control" id="pwd" style="position:absolute;width:350px;margin-top:255px;margin-left:900px;">
    <button type="submit" onClick="process_Login()" class="btn btn-default" style="font-weight:bold;font-family:Tahoma, Geneva, sans-serif;position:fixed;margin-left:1040px;margin-top:310px;width:100px;">Login</button>
    <button type="submit" class="btn btn-default" style="font-weight:bold;font-family:Tahoma, Geneva, sans-serif;position:absolute;margin-left:1150px;margin-top:310px;width:100px;">Sign Up</button>
  </div>
</div>

我在使用这段代码时遇到了一些问题，我正在 Web 中制作 ATM 视觉效果。我想将数据从 HTML 文件传输到 PHP 文件，我知道我必须使用 "form" 但我不知道在这种情况下如何使用它，我也使用 "script"解决用户输入错误的问题。

<script>
  function process_Login() {
    var c = document.getElementById("usr").value;
    var d = document.getElementById("pwd").value;
    if (c.length == 0) {
      alert("ERROR: Your ID account is NULL");
    } else if (isNaN(c)) {
      alert("ERROR: Your ID must be number");
    }
  }
</script>

我该如何解决？

Answer 1

您应该像这样创建表单：

<form action="file.php" method="post" onsubmit="return process_login()">
   <!-- your form code here -->
</for>

记得删除 <input type="submit"> 代码中的 onClick 处理程序比你的 javascript 代码：

<script type="text/javascript">
     function process_login(){
        var c = document.getElementById("usr").value;
        var d = document.getElementById("pwd").value;
        if(c.length==0){

           alert("ERROR: Your ID account is NULL");
           return false;

        } else if(isNaN(c)){

           alert("ERROR: Your ID must be number");
           return false;
        }
        return true;
      }
</script>

Answer 2

如果您正在制作表格，您会将其发布到您的 PHP 脚本中。您的输入需要有一个名称属性，即

<form action="myPHPLogin.php" method="post">
    <input type="text" placeholder="Do this.." name="username">

    <button type="submit">submit</button>
</form>

在您的 PHP 脚本中，您可以使用 $_POST['username'] 等访问您的字段

Answer 3

<div id="background">
 <div class="form-group">
<form method="post" id="dataForm">
<label for="usr" style="position:fixed;margin-top:180px;margin-left:900px;"><u>Account ID</u>:</label>
  <input type="text" placeholder="Enter your ID in here" class="form-control" id="usr" name="user" style="position:absolute;width:350px;margin-top:205px;margin-left:900px;">      
 </div>
 <div class="form-group">
   <label for="pwd" style="position:fixed;margin-top:230px;margin-left:900px;"><u>PIN</u>:</label>
   <input type="password" placeholder="Enter your PIN in here" class="form-control" id="pwd" name="pass" style="position:absolute;width:350px;margin-top:255px;margin-left:900px;">
   <button type="button" onClick="process_Login()" class="btn btn-default" style="font-weight:bold;font-family:Tahoma, Geneva, sans-serif;position:fixed;margin-left:1040px;margin-top:310px;width:100px;">Login</button>
   <button type="button" class="btn btn-default" style="font-weight:bold;font-family:Tahoma, Geneva, sans-serif;position:absolute;margin-left:1150px;margin-top:310px;width:100px;">Sign Up</button>
  </form>
</div>

//your javscript
 function process_Login() {
var c = document.getElementById("usr").value;
var d = document.getElementById("pwd").value;
if (c.length == 0) {
  alert("ERROR: Your ID account is NULL");
} else if (isNaN(c)) {
  alert("ERROR: Your ID must be number");
}

$.ajax({url:"your php page.php",type:'POST',data:$("#dataForm").serialize(),success: function(data){

    if(data==0){alert("No data Added");}
    }});

}

//on your php page
 <?php
 $user=$_POST['user'];
 $pass=$_POST['pass']; 
 //you database query for insert

 if($result)
 {
   echo "inserted";
 }
  else
 {
     echo 0;
 }
 ?>

在这种情况下，如何将数据从 html 传输到 php

How can I transfer data from html to php in this case

html

javascript

php

mysql