我希望在提交PHP表单时执行JS函数,并且从该函数,我想要返回一个值(基于用户的输入)到PHP,我喜欢这里回应它。
这是一个SSCCE。在实际代码中,不仅仅是回显值,而且值是JSON对象。
以下是我的代码。 问题是$.ajax();
部分无效。 alert(name);
之后浏览器中没有任何操作。
为什么这不正常?我该如何解决这个问题?
来自index.php:
<form id="form">
Name:
<input id="name" type="text" />
<input type="Submit" value="Go" />
</form>
来自scripts.js:
$(document).ready(function() {
$("#form").submit(function(event) {
event.preventDefault();
var name = $("#name").val();
alert(name);
$.ajax({
type:'POST',
url:'echo.php',
data: {
nameEntered : name
}
});
});
});
echo.php:
<?php
if ( isset($_POST["nameEntered"]) && !empty($_POST["nameEntered"]) ) {
echo $_POST["nameEntered"];
} else {
echo '$_POST["nameEntered"] is not set.';
}
?>
编辑:
控制台:
网络:
编辑2:
将以下内容添加到$.ajax()
:
,
success: function(){
alert("success");
},
error : function(){
alert("error");
}
我收到一条提示success
的提示,但浏览器从不指示echo.php = s
编辑3:
警告说success
后,?
会添加到浏览器中的网址中。最初,网址为http://localhost/Test12/index.php
,并且已更改为http://localhost/Test12/index.php?
。
答案 0 :(得分:2)
这种方式应该显示响应。
<强> JAVASCRIPT 强>
$("#form").submit(function(event) {
event.preventDefault();
var name = $("#name").val();
//alert(name);
$.ajax({
type:'POST',
url:'http://localhost/Test12/echo.php',
data: {
nameEntered : name
},
success : function(data){
console.log(JSON.parse(data));
},
error : function(error){
console.log('erro', error);
}
});
});
<强> PHP 强>
<?php
if (isset($_POST["nameEntered"]) && !empty($_POST["nameEntered"])) {
$name = array("nome" => $_POST["nameEntered"]);
echo json_encode($name);
} else {
echo '$_POST["nameEntered"] is not set.';
}
?>
答案 1 :(得分:1)
尝试删除document.ready()或代替.submit使用.on('submit',function(e){});或添加绝对路径'/page.php'
答案 2 :(得分:1)
我认为除了显示结果的成功调用之外,您还需要在提交功能中添加“event”作为参数
答案 3 :(得分:1)
这给你带来了什么:
$.ajax({
type:'POST',
url:'echo.php',
data: {
nameEntered : name
},
success: function(recd){ // <-------
alert(recd); // <-------
},
error : function(){
alert("error");
}
});
答案 4 :(得分:1)
作为测试,请将echo.php
替换为:
<?php
echo 'Incoming = ' .$_POST["nameEntered"]. "/r/n";
if (isset($_POST["nameEntered"]) && !empty($_POST["nameEntered"])) {
echo 'Here 01';
} else {
echo 'Here 02';
}
?>
答案 5 :(得分:0)
您正在调用event.preventDefault(),但您未能将该事件添加到您的回调参数中......因此您实际上并没有停止该表单提交。这就是你在地址栏中看到问号的原因。
尝试:
function(e){
e.preventDefault();
};