jQuery AJAX

来源:互联网 发布:化工公司工艺软件 编辑:程序博客网 时间:2024/06/05 20:25
<html><head><title>jQuery Ajax</title><meta name="lucheng" content="text/html;charset=UTF-8"/><script src="H:/jQuery/jquery-3.1.0.js"></script></head><body><!--jQuery在全局对象jQuery($)绑定了ajax()函数,可以处理AJAX请求。ajax(url,settings)函数需要接收一个URL和一个URL和一个可选的settings对象,常用的选项如下:async:是否异步执行AJAX请求,默认为truemethod:发送的Method,缺省为GET,可指定为POST、PUT、DELETEcontentType:发送POST请求的格式,默认值为application/x-www-from-urlencoded;charset=UTF-8data:发送的数据headers:发送额外的HTTP头,必须是一个objectdataType:接收的数据格式,可以指定为html、xml、json、text,缺省情况下根据响应的Content-Type猜测--><script>$(function (){$(document).on('click','#queryWeather',function (){var city = $('#city').val();//高德天气服务var url = "http://restapi.amap.com/v3/weather/weatherInfo?key=4aa728e05f91faabe805b633e5c631f3&city="+city;var jQueryAJAX = $.ajax(url, {dataType: 'json'}).done(function (data) {if(data.lives!=undefined) {alert('天气:' + data.lives[0].weather);} else {alert('城市没有找到');}}).fail(function (xhr, status) {alert('失败: ' + xhr.status + ', 原因: ' + status);}).always(function () {})});})$(function (){$(document).on('click','#queryIPAddress',function (){//112.95.206.216//高德IP地址查询服务var ip = $('#ip').val();var url = "http://restapi.amap.com/v3/ip?key=4aa728e05f91faabe805b633e5c631f3&ip="+ip;var jQueryAJAX = $.ajax(url, {dataType: 'json'}).done(function (data) {if(data.province!="" && data.city!=""){alert('地址:' + data.province + data.city);}}).fail(function (xhr, status) {alert('失败: ' + xhr.status + ', 原因: ' + status);}).always(function () {})});})/*//1.ajax$.ajax('<url>', {dataType: 'json'}).done(function (data) {alert('成功:' + data);}).fail(function (xhr, status) {alert('失败: ' + xhr.status + ', 原因: ' + status);}).always(function () {alert('请求完成: 无论成功或失败都会调用');})//2.get请求$.get('<url>', {name: 'Bob Lee',check: 1}); //3.post请求$.post('<url>', {name: 'Bob Lee',check: 1});//4.getJSON$.getJSON('<url>', {name: 'Bob Lee',check: 1}).done(function (data) {// data已经被解析为JSON对象了}); */</script><input type="text" id="city"/><button id="queryWeather" placeholder="请输入城市">查询天气</button><br/><input type="text" id="ip"/><button id="queryIPAddress" placeholder="请输入IP地址">查询IP地址</button></body></html>

原创粉丝点击