zl程序教程

您现在的位置是:首页 >  Javascript

当前栏目

阻止HTML表单提交跳转页面,使用 Jquery Ajax 请求接口

2023-02-25 18:20:00 时间

站长源码网

1. HTML 表单


<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<form action="" method="post" onsubmit="return save(this)">
手机号 <input type="text" name="mobile" autocomplete="off">
登录密码 <input type="text" name="password" autocomplete="off">
<button>提交</button>
</form>

2. Javascript 函数


/**
* 提交表单
*/
function save(obj)
{
var formData = {};
var array = $(obj).serializeArray();
$.each(array, function() {
formData[this.name] = this.value;
});
console.log(formData)
$.ajax({
url: '',
type: 'post',
async: false,
data: formData,
success: res => {
console.log(res)
}
})
return false;
}