ajax的理解

简介: function goe_local(){ //ip同步到服务端    $.ajax({                                           url:'ajax_ip.
function goe_local(){ //ip同步到服务端
   
$.ajax({                                         
 url:'ajax_ip.php',/*对应的php文件*/
 type: 'POST',
 data:'ip='+$('.srcs').val(),
 dataType: 'html',
 timeout: 50000,
 error: function(){
 alert('Error loading XML document');
 },
 success: function(aaa){ 
// alert($('.srcs').val());
 
 $('.ips').attr('value',aaa);
//alert(html);

   });   
 }
 
 
 
html====php
url指明的对应的处理服务器php文件


type:提交方式 post,get提交到对应php文件


date:提交的变量值 相当于php里的$ip=某个节点的值


datetype:服务器文件处理完毕后返回数据的格式,"html": 返回纯文本 HTML 信息


timeout:最大响应超时时间


error 和success是返回的提示:失败,成功
成功后:调用function(aaa) 其中aaa为php处理完毕后返回的数据
$('.ips').attr('value',aaa); 就是把返回的数据写到input方法里的value里面


success: function(aaa){ 
$('.ips').html(aaa);}:把返回值写到对应的div节点上面,<div class="ips">aaa</div>




实现的效果是:客户端数据提交到服务端处理,并且同步返回,不需要刷新 同步处理
其中对应的php输出的数据指定到ajax里面,也就说aaa变量,只是把值传到这里面了
想把他放到html页面,必须写个容器来让他显示,如下:
<input class="ips" id="ips"  type="hidden" name="ips" value="" />
<input type="hidden" name='src'  value="" id="src" class="srcs"  onchange="goe_local()"/>
第一个是把返回值 显示出来
第二个是把触发goe_local()方法,ajax需要事件来触发
目录
相关文章
|
缓存 前端开发
一步一步理解Ajax(二)
ajax方法:通过 HTTP 请求加载远程数据get方法: 通过远程 HTTP GET 请求载入信息post方法:通过远程 HTTP POST 请求载入信息1、创建XMLHttpRequest对象 function createXHR() {            return window.
1007 0
|
前端开发 JavaScript 数据格式
一步一步理解Ajax(三)
Ajax一般应用于户表单数据的验证,局部更新,如分页等等Ajax的优点与缺点优点:1、异步处理功能,可以选择性提交数据;2、局部更新;3、较少服务器负担;4、更快的响应速度;5、减轻带宽压力。缺点:1、局部更新不支持后退功能和添加到收藏夹功能;2、搜索引擎不支持Ajax的抓取;3、跨平台性不好;4、并非所有浏览器都支持Ajax;5、浏览器对Ajax的支持程度不同。
968 0
|
JavaScript 前端开发 数据安全/隐私保护
一步一步理解Ajax(一)
Ajax是Asynchronous Javascript And XML的缩写。作用:通过Ajax可以使用Javascript语句来调用XMLHttpRequest对象,直接与服务器进行通讯,可以在不重载页面的情况下与服务器交换数据。
913 0
|
12月前
|
XML 前端开发 JavaScript
什么是Ajax和jquery
什么是Ajax和jquery
83 0
|
6月前
|
JSON 前端开发 Java
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
132 0
|
6月前
|
敏捷开发 JavaScript 前端开发
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
|
6月前
|
前端开发 JavaScript
Jquery ajax捕获错误信息
Jquery ajax捕获错误信息
52 0
|
6月前
|
JSON 缓存 前端开发
Jquery中AJAX的应用
Jquery中AJAX的应用
75 0
|
6月前
|
JSON 前端开发 JavaScript
jQuery中ajax的使用
jQuery中ajax的使用
|
6月前
|
XML JavaScript 前端开发
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
88 0