转贴：JavaScript实现Ajax请求简单示例

【转贴：JavaScript实现Ajax请求简单示例】的更多相关文章

转贴：JavaScript实现Ajax请求简单示例

转至:https://my.oschina.net/u/658145/blog/167651 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> Ajax </title> <script type=&qu…

原生javaScript完成Ajax请求

使用原生javaScript完成Ajax请求,首先应该创建一个对象XMLHttprequest,考虑到兼容低版本IE浏览器,使用ActiveXObject对象,代码入下: var request; if(windoe.XMLHtprequest){ request=new XMLHttprequest(); }else{ request = new ActiveXObject(); } function success(text) { var textarea = document.getEle…

javascript版Ajax请求

什么是Ajax请求,Ajax也就是“Asynchronous JavaScript and XML”(异步JavaScript和XML),无刷新数据读取.能减少流量的消耗,也提高了浏览的流畅性,给用户更加友好的体验. 发送Ajax请求也就几步便可完成第一步:创建异步对象 var xhr = new XMLHttpRequest(); 这样创建的异步对象是给新版的浏览器用的,当然不乏一些用着旧版浏览器的老客户.旧版的创建方法如下: var xhr = new ActiveXObject('Mic…

AJAX的简单示例：注册校验

众所周知,我们每次需要注册一个网站的用户名时,都会校验该邮箱.用户名是不是正确的格式.是不是有被使用过,密码是否符合规则,二次确认是否符合. 如果这些校验都采用form表单提交的话,会给用户带来极不好的体验(form表单提交会刷新网页). 因此,在此引出ajax的一个作用:局部刷新(用户看不到的刷新).下面是用于注册示例ajax的局部刷新的简单示例: 注册页面: ajax代码: <script> {#取得iuputEmail框中的内容#} {#inputeamil = $('#i1').val…

JavaScript原生Ajax请求纯文本数据

源代码 ajax1.html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Ajax请求纯文本文档</title> </head> <body> <button type="button" id="button">请求纯文本</button> </…

JavaScript的Ajax请求示例

//创建XMLHttpRequest对象 var request = false; try { request = new XMLHttpRequest(); } catch (trymicrosoft) { try { request = new ActiveXObject("Msxml2.XMLHTTP&…

前端javascript发送ajax请求、后台书写function小案例

HTML端页面: <td> <input class="pp_text" type="text" name="" value="{$info.bar_code}" id="txtBarcode" style="float: left;"/> <input class="tj-button tj-button2" onclick="…

javascript中Ajax的简单封装

GET方式的在线:DEMO POST方式在线:DEMO // 1.封裝AJAX函數 function nativeAjax(option,success,error){ // 定义domain,方便环境切换 var domain='https://' + window.location.host + '/'; var url=domain+option.urlStr; var type=option.ajaxType; var data=option.ajaxData; var xhrReque…

javascript原生ajax请求

class Ajax{ constructor(url, method, data, callback_suc, callback_err, callback_run){ this.RT = true;//默认为异步请求 this.url = url; this.method = method || "POST"; this.data = data || ""; this.callback_suc = callback_suc || function () {};…

JavaScript 伪Ajax请求

伪Ajax 通过iframe以及form表单,可以实现伪Ajax的方式. 并且它的兼容性是最好的. iframe iframe标签能够获取一个其他页面的文档内容,这说明它内部肯定是发送了一个请求,并且收到后端的数据展示在页面上. 基于这一点,我们可以让他与form表单做一个结合使用. <iframe src="http://www.baidu.com//" frameborder="0"></iframe> 结合使用首先form表单中有一个…

JavaScript 回调函数的简单示例

回调函数回调函数也被称为高阶函数所谓高阶函数,就是说值函数作为参数被传递或者返回值输出操作函数的函数称为高阶函数把一段可执行的代码(一个函数)作为参数传递给其他的代码(另一个函数),并在需要的时候方便调用这个可执行代码(回调函数) // 过程,当我们在装修房子的时候,你负责采购材料,我负责粉刷墙面 // 当你还没有买回材料的时候,我不能一直等着你, 我就写了个纸条告诉你如何粉刷(回调函数) // 当你买回来材料后, 就按照我给你写的方法粉刷墙面 // 粉刷 function pain…

Ajax请求与浏览器缓存

在现代Web应用程序中,前端代码充斥着大量的Ajax请求,如果对于Ajax请求可以使用浏览器缓存,那么可以显著地减少网络请求,提高程序响应速度. 1. Ajax Request 使用jQuery框架可以很方便的进行Ajax请求,示例代码如下: 1 $.ajax({ 2 url : 'url', 3 dataType : "xml", 4 cache: true, 5 success : function(xml, status){ 6 } 7 }); 非常简单,注意其中的第4行代码:c…

【JavaWeb】AJAX 请求

AJAX 请求什么是 AJAX AJAX(Asynchronous JavaScript And XMl),即异步 JS 和 XML.是指一种创建交互式网页应用的网页开发技术. AJAX 是一种浏览器通过 JS 异步发起请求,局部更新页面的技术.它请求的局部更新,浏览器地址不会发生变化,且局部更新不会舍弃原来的页面. 原生 AJAX 示例 package cn.parzulpan.web; import cn.parzulpan.bean.User; import com.google.gso…

PHP 判断是否为 AJAX 请求

先说前端使用 jQuery 时怎么区分: jQuery 发出 ajax 请求时,会在请求头部添加一个名为 X-Requested-With 的信息,信息内容为:XMLHttpRequest 在后端可以使用 $_SERVER["HTTP_X_REQUESTED_WITH"] 来获取.(注意:中划线换成了下划线,不区分大小写) 由此,我们可以这样来判断是否为 ajax 请求: // php 判断是否为 ajax 请求 http://www.cnblogs.com/sosoft/ if(is…

php判断是否为ajax请求

先说前端使用 jQuery 时怎么区分: jQuery 发出 ajax 请求时,会在请求头部添加一个名为 X-Requested-With 的信息,信息内容为:XMLHttpRequest 在后端可以使用 $_SERVER["HTTP_X_REQUESTED_WITH"] 来获取.(注意:中划线换成了下划线,不区分大小写) 由此,我们可以这样来判断是否为 ajax 请求: if(isset($_SERVER["HTTP_X_REQUESTED_WITH"]) &am…

关于js中断ajax请求

停止javascript的ajax请求,一种是设置超时时间让ajax自动断开,另一种为手动去停止ajax请求,其核心是调用XMLHttpRequest对象上的abort方法,这里,我们以jquery举例说明: jquery的ajax对象的abort方法调用abort后jquery会执行error的方法,抛出abort的异常信息,这个时候就可以执行我们中断ajax后的操作了 var ajax = $.ajax({ 'error':function(jqXHR, textStatus, error…

ajax02_封装自己的jQuery库和ajax请求

封装自己的ajax类库首先封装自己的 jQuery库启发:css的元素选择器思想简单的代码实现 function jQuery(selector){ if(typeof selector == "string"){ if(selector.charAt(0) == "#"){ //原先的dom对象还要留着,因为最终的实现还要用这些对象的方法去实现,我们无法完成 //domObj为全局变量 domObj = document.getElementById(sel…

支持Ajax跨域访问ASP.NET Web Api 2(Cors)的简单示例教程演示

随着深入使用ASP.NET Web Api,我们可能会在项目中考虑将前端的业务分得更细.比如前端项目使用Angularjs的框架来做UI,而数据则由另一个Web Api 的网站项目来支撑.注意,这里是两个Web网站项目了,前端项目主要负责界面的呈现和一些前端的相应业务逻辑处理,而Web Api则负责提供数据. 这样问题就来了,如果前端通过ajax访问Web Api项目话,就涉及到跨域了.我们知道,如果直接访问,正常情况下Web Api是不允许这样做的,这涉及到安全问题.所以,今天我们这篇文章的主…

C#中缓存的使用 ajax请求基于restFul的WebApi(post、get、delete、put) 让 .NET 更方便的导入导出 Excel .net core api +swagger(一个简单的入门demo 使用codefirst+mysql) C# 位运算详解 c# 交错数组 c# 数组协变 C# 添加Excel表单控件（Form Controls） C#串口通信程序

C#中缓存的使用缓存的概念及优缺点在这里就不多做介绍,主要介绍一下使用的方法. 1.在ASP.NET中页面缓存的使用方法简单,只需要在aspx页的顶部加上一句声明即可: <%@ OutputCache Duration="100" VaryByParam="none" %> Duration:缓存时间(秒为单位),必填属性 2.使用微软自带的类库System.Web.Caching 新手接触的话不建议直接使用微软提供的类库,因为这样对理解不够深刻…

关于Ajax实现的简单示例

一.代码示例关于Ajax的基本概念(包括XMLHttpRequest对象及其相关方法属性)移步这里(w3school中文版)学习了解. <!doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title>使用Ajax异步加载数据</title> <script type = "text/javasc…

掌握 Ajax，第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求

转http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro2/ 掌握 Ajax,第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求在 Web 请求中使用 XMLHttpRequest 多数 Web 应用程序都使用请求/响应模型从服务器上获得完整的 HTML 页面.常常是点击一个按钮,等待服务器响应,再点击另一个按钮,然后再等待,这样一个反复的过程.有了 Ajax 和 XMLHttpRequest 对象,就可以使用不必让用户等…

Ajax请求过程中显示“进度”的简单实现

Ajax在Web应用中使用得越来越频繁.在进行Ajax调用过程中一般都具有这样的做法:显示一个GIF图片动画表明后台正在工作,同时阻止用户操作本页面(比如Ajax请求通过某个按钮触发,用户不能频繁点击该按钮产生多个并发Ajax请求):调用完成后,图片消失,当前页面运行重新编辑.以下图为例,页面中通过一个Load链接以Ajax请求的方式加载数据(左).当用户点击该链接之后,Ajax请求开始,GIF图片显示“Loading“状态,同时当前页面被“罩住”防止用户继续点击Load按钮(中):Ajax请求…

javascript的ajax功能的概念和示例

AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML). 个人理解:ajax就是无刷新提交,然后得到返回内容. 对应的不使用ajax时的传统网页如果需要更新内容(或用php做处理时),必须重载整个网页页面. 示例: html代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax示例<…

Ajax -- 原理及简单示例

1. 什么是Ajax •Ajax被认为是(AsynchronousJavaScript and XML的缩写).现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax. 2. Ajax 原理 AJAX采用异步交互过程.AJAX在用户与服务器之间引入一个中间媒介,从而消除了网络交互过程中的处理-等待-处理-等待缺点. 用户的浏览器在执行任务时即装载了AJAX引擎.AJAX引擎用JavaScript语言编写,通常藏在一个隐藏的框架中.它负责编译用户界面及与服务器之间的交互. AJAX引…

jQuery-实现简单的Ajax请求封装

封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,data,success,error){ if(type.toLowerCase()=='post'){ data = pack(data) } $.ajax({ type: type, url: base + url, contentType:'application/json', data:dat…

JavaScript原生封装ajax请求和Jquery中的ajax请求

前言:ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web 服务器交换数据,即在不需要刷新页面的情况下,就可以产生局部刷新的效果.Ajax 在浏览器与 Web 服务器之间使用异步数据传输(HTTP 请求),当然也可同步,这样就可使网页从服务器请求少量的信息,而不是整个页面.Ajax使我们的项目更小.更快,更友好,在前端开发有很高的地位,也是面试题的热点.本次测试是在localhost本地环境. 1.原生ajax (1)html前端代码get请求方式创建一个ajax实例xh…

Spring MVC 文件上传简单示例(form、ajax方式 )

1.Form Upload SpringMVC 中,文件的上传是通过 MultipartResolver 实现的,所以要实现上传,只要注册相应的 MultipartResolver 即可. MultipartResolver 的实现类有两个: CommonsMultipartResolver (需要 Apache 的 commons-fileupload 支持,它能在比较旧的 servlet 版本中使用,兼容性好) StandardServletMultipartResolver (不需要第三方…

一步步学习javascript基础篇（9）：ajax请求的回退

需求1: ajax异步请求 url标识请求参数(也就是说复制url在新页面打开也会是ajax后的效果) ajax异步请求没问题,问题一般出在刷新url后请求的数据没了,这就是因为url没有记录参数.如果我们改变给url添加参数,这样就改变了url,也就会重新请求整个url.这样一来就没有了ajax的优势和作用了.那么,我们应该怎么保持参数而又不重新请求url呢?做过单页面SPA (Single-page Application)的都知道,我们可以使用描点来实现(因为修改描点的时候,不会发送url…

多个ajax请求下等待条显示和隐藏的简单处理

处理为遇到ajax请求就显示等待条,直到所有的ajax请求执行完毕才关闭等待条.比较简单,源码如下(基于jQuery) //基于jQuery //从第一个ajax请求发出开始显示等待条?直到一系列ajax请求全部结束才关闭等待条. //任何ajax触发了ajaxSend事件会显示等待框,所有的ajax都执行完成(ajaxComplete事件)才会关闭等待框 $(function(){ //需要监听的ajax的url var listenUrls = [], //等待条选择器 loadingSel…

【转】分享JavaScript监听全部Ajax请求事件的方法

若Ajax请求是由jQuery的$.ajax发起的,默认情况下可以使用 jQuery的Global Ajax Event Handlers监听到Ajax事件,然而我遇到的却是用原生JavaScript发起的Ajax请求,所以这种方法行不通. 然后呢,还有其他方法,比如说 Pub/Sub,但是这个发起请求的 js 代码我是无法改动的,也就不存在向代码里添加 publish 的问题.同理,jQuery 的 .bind 和 .trigger 也无法使用. 最后,决定使用直接 override XMLH…