AJAX、AJAX实例及AJAX源代码(asp)

2016-01-29 11:26 36 1 收藏

AJAX、AJAX实例及AJAX源代码(asp),AJAX、AJAX实例及AJAX源代码(asp)

【 tulaoshi.com - Javascript 】

  AJAX介绍
  AJAX 关键词:
  javascript脚本和可扩展标记语言(XML) 
  WEB浏览器技术 
  开放式WEB标准 
  浏览器以及独立平台 
  更好更快的网络应用程序 
  XML以及HTTP请求 
  AJAX = 异步JavaScript和可扩展标记语言
  AJAX是一种运用JavaScript和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。
  AJAX是一种浏览器技术
  AJAX是一种运用于浏览器中的技术。在浏览器和服务器之间,它使用异步数据进行转换,并允许网页向服务器索取少量信息而非整个网页。
  这项技术标志着网络应用程序的微小化、迅捷化以及便捷化。
  AJAX是一种不需依靠服务器软件而独立运做的浏览器技术。
  AJAX是基于公共标准的
  AJAX基于以下一些公共标准:
  XML 可扩展标记语言 
  HTML 超文本标记语言 
  CSS 层叠样式表 
  运用于ALAX的公共标准被很好的定义并且得到一些主要的常用浏览器支持。ALAX应用程序是独立的浏览器和平台(交互平台,交互浏览器技术)。
  AJAX事关更好的网络应用程序
  网络应用程序比单机应用程序有更多的好处,它能符合更多用户的需求,更易安装且方便支持和扩展。
  然而,网络应用程序并非总是像单机应用程序一样好使唤。
  而运用AJAX,网络应用程序将变地更实用(更小、更快、更易于使用)。
  今天就开始使用AJAX吧!
  无需学习新的知识。
  AJAX是基于公共标准的。这些标准已经被大多数开发人员使用多年。
  大多数现存的网络应用程序可以用AJAX进行重新编写以取代传统的超文本标记语言方式。
  AJAX使用可扩展语言和HTTP请求
  传统的网络应用程序会将输入的信息提交给服务器(使用HTML表单)。在服务器通过代码后,将会把一个全新的完整的页面传送给用户。
  由于用户每次提交输入信息的时候服务器都将传回一个新的页面,传统的网络应用程序通常运行缓慢且使用不便。
  使用AJAX,网页应用程序能不经重新下载整个网页就发送并重新获得数据。这是通过发送HTTP请求和使用JS对网页进行部分修改来实现的。
  联系服务器的较好的方式是发送像可扩展标记语言这样的数据(其他的方法也可以采用)。
  你将在这篇引论的下一章节更多地了解到这一切是如何做到的。

  AJAX实例
  AJAX可以用来创建更多交互式的网络应用程序。
  AJAX 实例
  在以下的AJAX范例中,我们将了解到当用户以网页格式输入数据时一个网页是如何与网络服务器连接的。 
  在下面的框中输入姓名 *实际操作请前往W3Schools
First Name:  
Suggestions: 
  实例解析-超文本标记语言模式
  以上的范例所含超文本标记语言代码如下: 
<form 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)"
</form<pSuggestions: <span id="txtHint"</span</p 
  就如你看到的,它只是一个普通的表单,里面有一称为"txt1"的输入框
  下一段包括了一个称做“txtHint”的SPAN。这个SPAN是用来存储从服务器重新获得的信息的。
  当用户输入数据,名为“showHint()”的函数将被执行。这个函数的执行是由“onkeyup”事件触发的。换种说法:每当用户在txt1区域内触动键盘按钮,showHint的功能就被执行。
  实例解析- showHint()函数
  showHint()函数是一种位于HTML顶端的简单的JS函数。
  函数包含以下代码:
function showHint(str)

if (str.length  0)

var url="gethint.asp?sid="+Math.random()+"&q="+str [next]
xmlHttp=GetXmlHttpObject(stateChanged) 
xmlHttp.open("GET", url , true) 
xmlHttp.send(null) 

else

document.getElementById("txtHint").innerHTML="" 

}
  每当有字符被键入输入区内就会执行这个函数
  如有字符被输入文字输入区(str.length0)函数就执行:
  建立一个XMLHTTP对象 
  发送一个HTTP请求到服务器上的"gethint.asp"上 
  当HTTP触发一次变动则XMLHTTP对象就会执行stateChanged()函数 
  实例解析 - stateChanged()函数
  stateChanged()函数包含以下代码:
function stateChanged() 

if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")

document.getElementById("txtHint").inne

来源:https://www.tulaoshi.com/n/20160129/1482365.html

延伸阅读
标签: Web开发
对于一个像我一样刚刚接触Web开发且无多少实际项目经验的新手而言,AJAX技术显得复杂而又深奥。经过两天的baidu、google,我对AJAX的基本原理有了一个大致的认识,在此总结一下。 1. 什么是AJAX? AJAX全称是异步的JavaScript和XML,是Asynchronous JavaScript and XML的缩写。AJAX技术用于创建交互式网页应用的网站开发,至于何为异步,后...
标签: Web开发
代码如下: /* 调用方式: 1.POST方式 var txt = escape(sender.value); //document.getElementById("%= txtName.ClientID %").value); var data = "name=" + txt + "&pwd=" + txt; var option = { "url": "handler/Handler.ashx" , "action": "POST" , "callback": function(){ if (xmlHttp.readyState == 4) {//服务器给了回应 if (x...
标签: Web开发
我们已看到 AJAX 可被用来创建更多交互性的应用程序。 AJAX Suggest实例 在下面的 AJAX 例子中,我们会演示当用户向一个标准的 HTML 表单中输入数据时网页如何与 web 服务器进行通信。 在下面的文本框中输入名字: Suggestions: 例子解释 - HTML表单 表单的 HTML 代码: form First Name:input type="text" id="txt1&qu...
标签: Web开发
ajax.html 程序代码 代码如下: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" html xmlns="http://www.w3.org/1999/xhtml" head meta http-equiv="Content-Type" content="text/html; charset=gb2312" / title兼容多浏览器的AJAX入门实例(超详细注释)/t...
标签: Web开发
index.html 代码如下: html head titlejQuery Ajax 实例演示/title /head script src="./js/jquery.js" type="text/javascript"/script script type="text/javascript" $(document).ready(function(){//这个就是jQueryready ,它就像C语言的main 所有操作包含在它里面 $("#button_login").mousedown(function(){ login(); //点击ID...

经验教程

992

收藏

22
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部