我创建了一个包含多个表单的HTML站点,使用jQuery对话框UI来进行显示,并使用jQuery表单插件进行Ajax提交。
表单看起来像这样:
<form id="login_form" action="admin.php" method="post">
Username: <input type="text" name="username" id="username"/><br/>
Password: <input type="password" name="password" id="password"/>
</form>
...表单选项如下所示:
$('#login_form').dialog({
buttons:{
"Login": function(){
var options = {
success: function(data){
alert(data);
$(this).dialog("close");
$('#news_form').dialog("open");
},
timeout: 3000,
fail: function(data){
alert('fail');
},
clearForm: true
};
// bind form using 'ajaxForm'
$('#news_form').ajaxSubmit(options);
},
"Exit": function(){
$(this).dialog("close");
}
}
});
...而且php文件很简单:
<?php
$data = 'Herro!';
echo $data;
?>
问题在于成功提交表单后,返回的是提交源html页面,而不是像我预期的那样返回“Herro!”。那么我做错了什么?
admin.html和admin.php文件都在同一个目录下。
此外,网页是通过xampp在本地运行的,但我也尝试将其放在Web服务器上,但没有改善。
最终编辑:问题实际上是因为我在DOM中调用了不同的表单对象来提交数据,这个表单没有设置action属性。感谢大家快速解决问题。
$('#news_form').ajaxSubmit(options);
- piddl0r