我开始学习jQuery(一般的web开发),在这个例子中,我应该使用.ajax和success函数将输入(使用提交按钮的用户名和密码)发送到php页面。
这是html(表单)代码:
<form id="form1">
Enter Username :
<input type="text" id="userName">
<br>
Enter Password:
<input type="password" id="passWord">
<br>
<input type="submit" value="Submit" id="sub">
<br>
</form>
<div id="result"></div>
这是jQuery代码(3个警报只是为了检查我的代码在哪里停止并且第3个警报从未到达):
$(document).ready(function(){
$("form").submit(function(){
alert('clicked');
var send = $(this).serialize();
alert('gotData');
$.ajax({
type: "POST",
url: "login.php",
data: send,
dataType: "json",
success: function(msg){
alert('inAjax');
$("#result").html(msg.name + " " + msg.pass);
}
});
return false;
});
});
这是我的PHP代码:
<?php
$name = $_REQUEST['userName'];
$pass = $_REQUEST['passWord'];
$list = array('name' => $name, 'pass' => $pass);
$c = json_encode($list);
echo $c;
?>
代码不起作用(网页上没有任何内容)
答案 0 :(得分:1)
首先,表单元素需要具有name
属性。 id
值与提交目的无关。
最好只使用.post()
方法:
$.post('login.php', $(this).serialize(), function(resp){ alert(resp); });
如果您使用Chrome,则不要使用提醒跟踪,只需将debugger;
放在功能的开头,这样就会暂停代码并为您打开检查器。
答案 1 :(得分:0)
首先检查您是否在http环境中发送请求。为此,您可以使用PHP built-in webserver作为快速解决方案。
//Choose the directory
$ cd ~/public_html
//Start the webserver on port 8000
$ php -S localhost:8000
同时将type
属性更改为method
。
如果服务器端出现问题,请使用浏览器devtools或其他http客户端(如Postman)检查您的请求。