Javascript 如何使用AJAX(不是Jquery AJAX)发送参数并使用PHP接收参数
我正在尝试使用HTML表单值向服务器发送一些AJAX(不是jQueryAjax)参数,并将其存储到数据库中。但它不能正常工作。当我按下“让我们开始”按钮时,我收到了错误消息 这是我的密码Javascript 如何使用AJAX(不是Jquery AJAX)发送参数并使用PHP接收参数,javascript,php,html,ajax,Javascript,Php,Html,Ajax,我正在尝试使用HTML表单值向服务器发送一些AJAX(不是jQueryAjax)参数,并将其存储到数据库中。但它不能正常工作。当我按下“让我们开始”按钮时,我收到了错误消息 这是我的密码 <div class ="col-xs-12 col-md-12 col-sm-12 col-lg-12" id ="AJAXsignup"> <h3>Creating a new account...</h3> <input clas
<div class ="col-xs-12 col-md-12 col-sm-12 col-lg-12" id ="AJAXsignup">
<h3>Creating a new account...</h3>
<input class ="form-control" type ="text" name ="fullname" placeholder ="Type your name eg:-Jhon Smith" id ="namefull">
<span class ="label label-warning" id ="err_fullname">You should type your name</span>
<input class ="form-control" type ="text" name ="username" placeholder ="Type your user name eg:-Jhon 95" id ="nameuser" style ="margin-top:5px;">
<span class ="label label-warning" id ="err_username">Missing username</span>
<div class ="input-group">
<span class ="input-group-addon">@</span>
<input class ="form-control" type ="email" name ="email" placeholder ="Type your Email" id ="email" style ="margin-top:5px;">
<span class ="label label-warning" id ="err_email">Missing email</span>
</div>
<input class ="form-control" type ="password" name ="password" placeholder ="Type your Password" id ="pass" style ="margin-top:5px;">
<span class ="label label-warning" id ="err_password">Missing Password</span>
<input class ="form-control" type ="password" name ="password" placeholder ="Repeat your Password" id ="repass" style ="margin-top:5px;">
<span style ="margin-bottom:5px;" class ="label label-warning" id ="err_repass">Repeat Password</span>
<img class ="col-sm-offset-5 col-md-offset-5 col-lg-offset-5" src ="images\Preloader_2.gif" id ="loader" style ="display:none;" style ="margin-bottom:5px;">
<input class ="btn btn-lg btn-info col-md-12 col-lg-12 col-sm-12 col-xs-12" type ="submit" id ="btn" value ="Let's start!" style ="margin-bottom:5px;" onclick = "validate()">
<input class ="btn btn-lg btn-danger col-md-12 col-lg-12 col-sm-12 col-xs-12"type ="button" id ="frm-can" value ="No.Thanks">
</div>
PHP代码
$fullname = $_GET['w'];
$username = $_GET['n_p'];
$email = $_GET['tv'];
$password = $_GET['q'];
$server = "localhost";
$username = "root";
try{
$conn = new PDO("mysql:host=$server;dbname=reg_mem",$username);
$conn->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);
$sql = "INSERT INTO mem_info(Full_name,User_name,Email,Password) VALUES($fullname,$username,$email,$password)";
$conn->exec($sql);
echo "The infomation sent sunncessfully.";
}catch(PDOException $e){
echo "The infomation unable to send right now";
}
如果要使用GET方法发送信息,请将信息添加到URL:
xhttp.open("GET", "filename.php?fname=value&lname=value", true);
xhttp.send();
要像HTML表单一样发布数据,请使用setRequestHeader()添加HTTP标头。在send()方法中指定要发送的数据:
使用Jquery ajax将var发送到PHP页面
$.ajax({
type: "GET", (or POST)
url: "code.php",
data: { fullname, user_n, email },
cache: false,
success: function(){
}
});
});
只需从HTML更改这一行
<input class ="btn btn-lg btn-info col-md-12 col-lg-12 col-sm-12 col-xs-12" type ="submit" id ="btn" value ="Let's start!" style ="margin-bottom:5px;" onclick = "validate()">
到
您只需将您的onclick=“validate()”
更改为onclick=“sendingformation();”
或者您可以在单击时调用2个函数,比如onclick=“sendingformation();validate();“
假设您的validate()
工作正常并且发送信息()
是从validate()
函数中调用的。我制作了代码的工作副本。我在$(“#loader”)中发现了一个错误代码>。如果没有包含jQuery
,则不能调用fadeOut()
。但是如果您已经包含了jQuery
,那么就不需要javascript函数,您可以使用jqueryajax本身
除此之外,您的代码工作正常。您遇到了哪个错误?
$.ajax({
type: "GET", (or POST)
url: "code.php",
data: { fullname, user_n, email },
cache: false,
success: function(){
}
});
});
<input class ="btn btn-lg btn-info col-md-12 col-lg-12 col-sm-12 col-xs-12" type ="submit" id ="btn" value ="Let's start!" style ="margin-bottom:5px;" onclick = "validate()">
<input class ="btn btn-lg btn-info col-md-12 col-lg-12 col-sm-12 col-xs-12" type ="submit" id ="btn" value ="Let's start!" style ="margin-bottom:5px;" onclick = "sendinginfomation()">