用Ajax实现静态页面中的判断

动态加载网页内容

最新推荐文章于 2023-07-20 16:55:55 发布

原创最新推荐文章于 2023-07-20 16:55:55 发布 · 649 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #exception #xmlhttprequest #html #session #div

相关技术专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种使用JavaScript结合ASP及XMLHttpRequest实现网页内容动态加载的方法。通过定义setInnerHTML和getInnerHTML函数来设置和获取HTML元素的内容，并利用XMLHttpRequest对象从服务器请求数据。服务器端脚本showcontent.asp响应请求并返回特定内容。

1、静态文件123.html

<html>

</body>

</html>

2、JS文件showcontent.js

// JavaScript Document for set innerHTML
function setInnerHTML(objId, html){
try{
  var obj = document.getElementById(objId);
  obj.innerHTML = html;
}catch(exception){
  alert("Make sure the object id is correct!");
}
}

function getInnerHTML(objId){
try{
  var obj = document.getElementById(objId);
  return obj.innerHTML;
}catch(exception){
  alert("Make sure the object id is correct!");
}
}
/* Create a new XMLHttpRequest object to talk to the Web server */
var xmlHttp = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
   xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
   try {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (e2) {
      xmlHttp = false;
   }
}
@end @*/

if (!xmlHttp && typeof XMLHttpRequest != "undefined") {
  xmlHttp = new XMLHttpRequest();
}

function ShowContent(){
try{
  var url = "showcontent.asp";
  xmlHttp.open("GET", url, true);
  xmlHttp.onreadystatechange = ContentOk;
  xmlHttp.send(null);
}catch(exception){}
}

function ContentOk(){
if (xmlHttp.readyState == 4) {
  try{
   var response = xmlHttp.responseText;
   var alertObj = document.getElementById("Content");
   alertObj.innerHTML=response;
  }catch(exception){}
}
}

3、脚本文件showcontent.asp

Response.Expires = -1

Response.ExpiresAbsolute = Now() - 1

Response.cachecontrol = "no-cache"

if session("id")="" then

str="请先登录"

else

str="123456"

end if

Response.AddHeader "Content-Type","text/html; charset=gb2312"

Response.Write ""&str&""