ajax调用简单实例

本文实例讲述了ajax调用的方法。分享给大家供大家参考，具体如下：

把url返回的数据,填充到指定id的div中

客户端: test.html

<script>
function createXMLHttp()
{
  var ret = null;
  try {
    ret = new ActiveXObject('Msxml2.XMLHTTP');
  }
  catch (e) {
    try {
      ret = new ActiveXObject('Microsoft.XMLHTTP');
    }
    catch (ee) {
      ret = null;
    }
  }
  if (!ret && typeof XMLHttpRequest != 'undefined')
    ret = new XMLHttpRequest();
  return ret;
}
function loadXmlToElement(fragment_url, element_id)
{
 var element = document.getElementById(element_id);
 element.innerHTML ='<img src="loading.gif" border="0"/>数据加载中...<br/>';
 var xmlhttp = createXMLHttp();
 xmlhttp.open("GET", fragment_url);
 xmlhttp.onreadystatechange = function()
 {
 if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
 {
  //alert(xmlhttp.responseXML.getElementsByTagName("data")[0].childNodes[0].nodeValue);
  element.innerHTML =
unescape(xmlhttp.responseXML.getElementsByTagName("data")[0].childNodes[0].nodeValue);
  if(!element.innerHTML || element.innerHTML == "/n")
  {
  try{
   element.innerHTML = unescape(xmlhttp.responseXML.firstChild.childNodes[1].nodeValue);
  }catch(e){}
  }
 }
 }
 xmlhttp.send(null);
}
</script>
<div id="data">
</div>
<script>
 var url="t.xml";
 //alert(url);
 loadXmlToElement(url,"data");
</script>

把url返回的数据,填充到指定id的div中

服务端:

test.xml

<?xml version='1.0' encoding='utf-8' ?>
<data>
<![CDATA[
this is a test
]]>
</data>

注意服务器返回CDATA格式数据,内部可以是任何html代码

希望本文所述对大家ajax程序设计有所帮助。

赞 (0)

相关推荐

  • jQuery+json实现的简易Ajax调用实例

    本文实例讲述了jQuery+json实现的简易Ajax调用.分享给大家供大家参考,具体如下: Userservlet.java代码: package com.iss.servlet; import org.json.JSONException; import org.json.JSONObject; import com.iss.pojo.User; import com.iss.util.JSONUtil; public class UserServlet extends HttpServle

  • Ajax异步提交数据返回值的换行问题实例分析

    本文实例分析了Ajax异步提交数据返回值的换行问题.分享给大家供大家参考,具体如下: 前面分析介绍了<Javascript基于AJAX回调函数传递参数>及<IE浏览器与FF浏览器关于Ajax传递参数值为中文时的区别>,学习了ajax回调函数传参与针对不同浏览器处理中文乱码问题的方法.这里就来分析一下ajax异步提交返回值中换行问题的处理技巧. 背景介绍: 需要实现的功能是:在下拉框中选择分类,提交到PHP根据选择的分类返回该分类下的成员名称,返回值各成员姓名以换行的形式显示到tex

  • ajax中data传参的两种方式分析

    本文实例讲述了ajax中data传参的两种方式.分享给大家供大家参考,具体如下: 1. POST方式: /** * 订单取消 * @return {Boolean} 处理是否成功 */ function orderCancel(orderId, commant){ var flag = false; $.ajax({ type: "POST", url: "../order/orderCancel.action", //orderModifyStatus data:

  • IE浏览器与FF浏览器关于Ajax传递参数值为中文时的区别实例分析

    本文实例讲述了IE浏览器与FF浏览器关于Ajax传递参数值为中文时的区别.分享给大家供大家参考,具体如下: 前面介绍了<Javascript基于AJAX回调函数传递参数>,这里主要来分析一下ajax传递中文参数过程中针对不同浏览器的乱码处理方法. Ajax传递参数为中文时出现乱码,我遇到的情况是: 1.我的数据库连接 编码为 GB2312,latin1_swedish_ci 2.php 文件编码格式为 UTF-8,浏览器显示编码为 : UTF-8 3.我的页面显示方式为两种: 一)页面加载时自

  • JQuery中Ajax()的data参数类型实例分析

    本文实例分析了JQuery中Ajax()的data参数类型.分享给大家供大家参考,具体如下: 前面简单分析介绍了<ajax中data传参的两种方式>,对于ajax参数传递方式有了初步的了解,这里就来进一步分析一下ajax中data参数的类型. 假如现在有这样一个表单,是添加元素用的. <form id='addForm' action='UserAdd.action' type='post'> <label for='uname'>用户名</label>:&

  • Javascript基于AJAX回调函数传递参数实例分析

    本文实例讲述了Javascript基于AJAX回调函数传递参数的方法.分享给大家供大家参考,具体如下: 前面介绍了<javascript实现html页面之间参数传递的四种方法>,这里针对ajax参数传递做一分析. 在Javascript 中,特别是在AJAX中,回调函数常常是一个函数名,没有地方放入参数,如下面的AJAX代码,在成功后将调用回调函数callback,但callback是有参数的,如何把参数传进来呢? var callback = function(p1){ //do somet

  • ajax调用简单实例

    本文实例讲述了ajax调用的方法.分享给大家供大家参考,具体如下: 把url返回的数据,填充到指定id的div中 客户端: test.html <script> function createXMLHttp() { var ret = null; try { ret = new ActiveXObject('Msxml2.XMLHTTP'); } catch (e) { try { ret = new ActiveXObject('Microsoft.XMLHTTP'); } catch (e

  • 原生ajax调用数据实例讲解

    由于jQuery的盛行,现在使用较多的是jQuery封装好了的ajax,因为解决了浏览器兼容性问题,这对程序员来说就等于去掉了一个心头大患,但并非原生ajax就销声匿迹,并且本人感觉还是对原生的ajax有所了解的好,下面就是一段ajax数据调用的实例代码,非常的简单,初学者可以参考一下.代码如下: 一.兼容浏览器部分 function xmlHttpR() { var xmlhttp; if(window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(

  • 分享Ajax创建简单实例代码

    XmlHttp是一套可以在Javascript.VbScript.Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API.XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面.几乎所有的浏览器都支持XMLHttpRequest对象,它是Ajax应用的核心技术. js代码如下: <html> <head> <title> New Document </title> <meta charset="utf

  • HTML页面,测试JS对C函数的调用简单实例

    这里记一下,以后要用的时候可以查! <HTML> <HEAD> <META NAME="GENERATOR" Content="Microsoft Visual Studio"> <meta http-equiv="content-type" content="text/html;charset=gbk"> <TITLE>HTML页面,测试JS对C函数的调用</

  • Jquery + Ajax调用webService实例代码(asp.net)

    webService中要实现ajax调用,则要加这句代码: // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释. [System.Web.Script.Services.ScriptService] 代码下载 /201008/yuanma/WebService2.rar 复制代码 代码如下: //无参数调用 $(document).ready(function() { $('#btn1').click(function() { $.ajax({ typ

  • 基于Aforge摄像头调用简单实例

    基于C#的Aforge类调用简单示例,供大家参考,具体内容如下 由题,本程序是使用Aforge类库调用摄像头的demo. 功能: 1.预览 2.前后摄像头切换 1.判断是否有摄像头,无则提示     2.有,判断摄像头个数,有1个则直接打开预览     3.有2个或以上,提示选择后打开相应摄像头预览     3.拍照功能 控件: 1.摄像头列表下拉框:用于选择摄像头,如无摄像头则不能下拉 2.拍照按钮:用于拍照,照片默认存储在当前程序运行目录,名称为"Aforge.bmp".如无摄像头

  • Jquery Ajax解析XML数据(同步及异步调用)简单实例

    复制代码 代码如下: $.ajax({                async: true, // 默认true(异步请求)                cache: true, // 默认true,设置为 false 将不会从浏览器缓存中加载请求信息.                type: "POST", // 默认:GET 请求方式:[POST/GET]                dataType: "xml", //默认["xml&quo

  • 使用Ajax实现简单的带百分比进度条实例

    使用Ajax实现简单的带百分比进度条实例

    需求:当进行文件长传保存等操作时,能在页面显示一个带百分比的进度条,给用户一个好的交互体验 实现步骤 JSP页面 1.添加table标签 <table id="load" width="700" border="0" align="center" bgcolor="#FAFAFA" cellpadding="0" cellspacing="0" borderco

  • 用AJAX实现页面登陆以及注册用户名验证的简单实例

    AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX 是一种用于创建快速动态网页的技术.其核心是 JavaScript 对象 XMLHttpRequest.该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术.简而言之,XMLHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户. 通过在后台与

  • Ajax的jsonp方式跨域获取数据的简单实例

    jsonp的调用,今天碰到了,正好整理了一下. <!DOCTYPE html> <html> <head> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#b

随机推荐