Dzwebs.Net

撰写电脑技术杂文十余年

最简单的AJAX 无刷新学习例子(示例,包含代码和完整的注释)

Admin | 2007-12-28 22:16:52 | 被阅次数 | 7677

温馨提示!

如果未能解决您的问题,请点击搜索;登陆可复制文章,点击登陆

<input type="button" onclick="ajaxTest()" value="AJAX测试">

<input type="button" onclick=" document.getElementById('weather').innerHTML='' " value="隐藏">

<script>
// 1. 初始化 请求 对象
// Mozilla/Firefox 下的
var xmlhttp = new XMLHttpRequest();
// IE 下的
//var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")
//alert(xmlhttp);

function ajaxTest() {
    // 指定要打开的页面
    xmlhttp.open("GET", "staticpage.html", true);// HTTP 请求的方式, URL, 是否异步
    // 指定页面打开完之后要进行的操作.
    xmlhttp.onreadystatechange = mychange;
    // 开始发起浏览请求, Mozilla 必须加 null
    xmlhttp.send(null);
}

// 这个函数就是每次状态改变要调用的函数
function mychange() {
    // 请求已完成
    if(xmlhttp.readyState == 4) {
        //alert(xmlhttp.readyState);
        alert(xmlhttp.responseText);
        // 更新对应的 HTML 元素里面显示的内容
    // 根据 ID 引用页面里面的元素 document.getElementById(元素名)
    document.getElementById('weather').innerHTML = xmlhttp.responseText;
    }
}
</script>

<div id="weather"></div>

//以上代码为网络转载!


该杂文来自: 网站开发杂文

上一篇:什么是AJAX无刷新技术

下一篇:在ASP.NET中使用AJAX无刷新技术的简单方法

网站备案号:

网站备案号:滇ICP备11001339号-7

版权属性:

Copyright 2007-2021-forever Inc. all Rights Reserved.

联系方式:

Email:dzwebs@126.com QQ:83539231 访问统计