php - ajax提交表单为什么页面还跳转呢?
本文介绍了php - ajax提交表单为什么页面还跳转呢?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
数据能提交也能返回。但是页面会跳转, 跳转后的url是get形式的。
如:http://127.0.0.1:8080/MyBlog/Admin/Blog/insert?title=111&tags=111
<script type="text/javascript">
$('#submit').on('click', function () {
var action = $('#form1').attr('action');
var title = $('#title').val();
var tags = $('#tags').val();
var content = $('#textarea1').val();
$.post(
action,
{title: title, tags: tags, content: content},
function (data) {
layer.msg(data.message, {
icon: data.icon,
time: 2000 //2秒关闭(如果不配置,默认是3秒)
});
}
);
});
</script
<div class="main-content">
<div class="container">
<div class="xb4">
<h1 class="float-left text-black margin-large-bottom">写博客</h1>
<form id="form1" action="{:U('Admin/Blog/insert')}" class="margin-large-top">
<div class="form-group">
<div class="field">
<input type="text" class="input" id="title" name="title" size="30" placeholder="标题"/>
</div>
<div class="field margin-big-top">
<input type="text" class="input" id="tags" name="tags" size="30"
placeholder="关键字。多个关键字用,分开"/>
</div>
</div>
</div>
<div class="xb10">
<textarea name="content" id="textarea1" style="height:400px;max-height:500px;">
<p></p>
</textarea>
<button id="submit" class="button border-black float-left margin-big-top">发表</button>
</div>
</form>
</div>
if(M('article')->add($add)){
$data['message'] = '发布成功';
$data['icon'] = 6;
$this->ajaxReturn($data);
}else{
$data['message'] = '发布失败';
$data['icon'] = 5;
$this->ajaxReturn($data);
}
解决方案
因为你提交的按钮是button,button的type默认是submit,当你点击按钮时,先触发ajax,接着执行form表单提交
这篇关于php - ajax提交表单为什么页面还跳转呢?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文