form表单submit按钮提交页面不跳转
Posted zhangruisoldier
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了form表单submit按钮提交页面不跳转相关的知识，希望对你有一定的参考价值。
方案一
<html>
<body>
<form action="" method="post" target="nm_iframe">
<input type="text" id="id_input_text" name="nm_input_text" />
<input type="submit" id="id_submit" name="nm_submit" value="提交" />
</form>
<iframe id="id_iframe" name="nm_iframe" style="display:none;"></iframe>
</body>
</html>
方案二
<html>
<body>
<form action="/api/user/register" method="post" id="registSubmit" >
<input type="text" id="id_input_text" name="nm_input_text" />
<input type="submit" id="id_submit" name="nm_submit" value="提交" />
</form>
</body>
</html>
$(‘#registSubmit‘).on(‘submit‘, function(){
registPost()
event.preventDefault() //阻止form表单默认提交
})
function registPost () {
$.ajax({
type: "post",
url: "/api/user/register",
data: $(‘#registSubmit‘).serialize(),
}).success(function(message) {
console.log(message)
}).fail(function(err){
console.log(err)
})
/*
或者用jquery.form.min.js提交
$(‘#registSubmit‘).ajaxSubmit(function(message){
console.log(message);
})
*/
}
以上是关于form表单submit按钮提交页面不跳转的主要内容，如果未能解决你的问题，请参考以下文章