ajax 请求接口实例

通过 HTTP 请求加载远程数据。

jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。

最简单的情况下,$.ajax()可以不带任何参数直接使用。

注意,所有的选项都可以通过$.ajaxSetup()函数来全局设置。

回调函数

如果要处理$.ajax()得到的数据,则需要使用回调函数。beforeSend、error、dataFilter、success、complete。

 

jquery  API地址:https://jquery.cuishifeng.cn/jQuery.Ajax.html

 

 

<!-- 表单部分 -->
<
form action="#" onsubmit="return false" method="post" id="form">
<input type="text" value="" placeholder="公司名称" id="lyname" name="name" required="required" style="float: left;" maxlength="20" class="mar_m" />
<input type="text" value="" placeholder="您的手机" id="lytel" name="tel" required="required" style="float: right;" maxlength="11" id="phone" onblur="checkPhone()" />
<div style="clear:both"></div>
<input type="text" name="remark" id="lyremark" value="" placeholder="留言内容" class="content" />
<div id="" class='send'>
<button type="submit" onclick="login()">提交</button></div>
</form>

<!-- js部分 -->

// ajax表单提交
function login() {
// alert("remark:"+ $('#lyremark').val()+"name:"+ $('#lyname').val()+"tel:"+ $('#lytel').val())
$.post("您的接口地址", {

//获取用户输入的值,也是要传到后台的字段
remark: $('#lyremark').val(),  
name: $('#lyname').val(),
tel: $('#lytel').val(),

//以下为不需要获取的字段,留空即可
tel_spare: "",
source: "官网",
group: "",
record_user_name: "",
owner_name: "",
type: null,
record_user: null,
owner: null,
department: null
},

//请求成功之后执行的函数
function(result) {
console.log(result);
// 请求成功后把值清空
$('#lyremark').val('');
$('#lyname').val('');
$('#lytel').val('');

//提示信息
alert('您已提交成功!');
});


}

 

 

posted @ 2020-06-15 15:29  奔跑的前端猿  阅读(2774)  评论(1编辑  收藏  举报