随笔-86  评论-767  文章-3  trackbacks-3

有网友反映说《AJAX开发简略》配文代码不全。其实应该是全的,只是要把包括框架和两个示例的程序都整合起来看。这里把全部的代码贴出来,需要的朋友可以看看。
sample1_1.jsp:
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">
 var http_request = false;
 function send_request(url) {//初始化、指定处理函数、发送请求的函数
  http_request = false;
  //开始初始化XMLHttpRequest对象
  if(window.XMLHttpRequest) { //Mozilla 浏览器
   http_request = new XMLHttpRequest();
   if (http_request.overrideMimeType) {//设置MiME类别
    http_request.overrideMimeType('text/xml');
   }
  }
  else if (window.ActiveXObject) { // IE浏览器
   try {
    http_request = new ActiveXObject("Msxml2.XMLHTTP");
   } catch (e) {
    try {
     http_request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {}
   }
  }
  if (!http_request) { // 异常,创建对象实例失败
   window.alert("不能创建XMLHttpRequest对象实例.");
   return false;
  }
  http_request.onreadystatechange = processRequest;
  // 确定发送请求的方式和URL以及是否同步执行下段代码
  http_request.open("GET", url, true);
  http_request.send(null);
 }
 // 处理返回信息的函数
    function processRequest() {
        if (http_request.readyState == 4) { // 判断对象状态
            if (http_request.status == 200) { // 信息已经成功返回,开始处理信息
                alert(http_request.responseText);
            } else { //页面不正常
                alert("您所请求的页面有异常。");
            }
        }
    }
 function userCheck() {
  var f = document.form1;
  var username = f.username.value;
  if(username=="") {
   window.alert("用户名不能为空。");
   f.username.focus();
   return false;
  }
  else {
   send_request('sample1_2.jsp?username='+username);
  }
 }
</script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>
<form name="form1" action="" method="post">
用户名:<input type="text" name="username" value="">&nbsp;
<input type="button" name="check" value="唯一性检查" onClick="userCheck()">
<input type="submit" name="submit" value="提交">
</form>
<!--span style="cursor: pointer; text-decoration: underline" onclick="send_request('2.jsp?username=educhina')">Send a request</span-->
</body>
</html>

sample1_2.jsp:
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %>
<%
String username= request.getParameter("username");
if("educhina".equals(username)) out.print("用户名已经被注册,请更换一个用户名。");
else out.print("用户名尚未被使用,您可以继续。");
%>

sample2_1.jsp:
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">
 var http_request = false;
 var currentPos = null;
 function send_request(url) {//初始化、指定处理函数、发送请求的函数
  http_request = false;
  //开始初始化XMLHttpRequest对象
  if(window.XMLHttpRequest) { //Mozilla 浏览器
   http_request = new XMLHttpRequest();
   if (http_request.overrideMimeType) {//设置MiME类别
    http_request.overrideMimeType('text/xml');
   }
  }
  else if (window.ActiveXObject) { // IE浏览器
   try {
    http_request = new ActiveXObject("Msxml2.XMLHTTP");
   } catch (e) {
    try {
     http_request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e) {}
   }
  }
  if (!http_request) { // 异常,创建对象实例失败
   window.alert("不能创建XMLHttpRequest对象实例.");
   return false;
  }
  http_request.onreadystatechange = processRequest;
  // 确定发送请求的方式和URL以及是否同步执行下段代码
  http_request.open("GET", url, true);
  http_request.send(null);
 }
 // 处理返回信息的函数
    function processRequest() {
        if (http_request.readyState == 4) { // 判断对象状态
            if (http_request.status == 200) { // 信息已经成功返回,开始处理信息
                //alert(http_request.responseText);
    document.getElementById(currentPos).innerHTML = http_request.responseText;
            } else { //页面不正常
                alert("您所请求的页面有异常。");
            }
        }
    }
 //显示部门下的岗位
 function showRoles(obj) {
  document.getElementById(obj).parentNode.style.display = "";
  document.getElementById(obj).innerHTML = "正在读取数据..."
  currentPos = obj;
  send_request("sample2_2.jsp?playPos="+obj);
 }
</script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="200" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td height="20"><a href="javascript:void(0)" onClick="showRoles('pos_1')">经理室</a></td>
    </tr>
    <tr style="display:none">
        <td height="20" id="pos_1">&nbsp;</td>
    </tr>
    <tr>
        <td height="20"><a href="javascript:void(0)" onClick="showRoles('pos_2')">开发部</a></td>
    </tr>
    <tr style="display:none ">
        <td id="pos_2" height="20">&nbsp;</td>
    </tr>
</table>
<!--a href="javascript:void(0)" onClick="showRoles('pos_1')">测试</a-->
<!--span style="cursor: pointer; text-decoration: underline" onclick="send_request('2.jsp?username=educhina')">Send a request</span-->
</body>
</html>

sample2_2.jsp:
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %>
<%
String playPos = request.getParameter("playPos");
if("pos_1".equals(playPos)) out.print("&nbsp;&nbsp;总经理<br>&nbsp;&nbsp;副总经理");
else if("pos_2".equals(playPos)) out.println("&nbsp;&nbsp;总工程师<br>&nbsp;&nbsp;软件工程师");
%>

posted on 2005-11-01 09:26 eamoi 阅读(6951) 评论(29)  编辑  收藏 所属分类: AJAX

评论:
# re: 【原创】《AJAX开发简略》配文代码 2005-11-03 21:11 | emu
document.getElementById(currentPos).innerHTML = http_request.responseText;

不如叫AJAH算了。如果你知道我在说什么,我想你会同意我的说法的。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-04 08:34 | eamoi
了解您的意思。
后续文章还在草稿中,内容主要关于DOM和XML的。
谢谢您的关注。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-04 13:06 | emu
哈哈你要写就赶快哈,我也在酝酿中。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-04 13:21 | emu
搜了一下,你的文章转载的地方很多呀。看来现在这方面的中文资料真的是太缺乏了。
可惜很多网站都没有给出你的原文链接。以后写技术文章也写一个版权声明上去好了。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-04 15:13 | eamoi
版权声明已经写了。原来的定位就是open doc。放到网络上,版权问题只希望大家共同遵守。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-06 15:42 | jiniboy
有转载不是坏事阿  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-09 13:28 | tilin
今天刚开始学AJAX,很好.文章对我很有帮助,谢谢~~  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-18 11:11 | yoyozy
看了您的文章收获很大,有关ajax的中文资料真的很少,很期待这样的文章。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-19 23:13 | 谢孟军
很激动,现在还有像你这样的无私的人.支持你的创作  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-21 11:35 | 白起
今天看到一个帖子,提到ajax开发,通过百度搜索了知道你的这个文章,但我把你的代码复制了,第一个怎么显示的结果是把sample1_2.jsp的代码显示出来了  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-21 13:43 | eamoi
肯定是你的服务器不支持JSP。正常sample1_2.jsp是要编码后再返回的。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-28 18:27 | jia
有没把http_request.open("POST", url, true);
的写法!!  回复  更多评论
  
# sample1_2.jsp里面有个错误 2005-11-29 15:48 | 金海龙
<%@ page contentType="text/html; charset=gb2312" language="java" errorPage="" %>
<%
String playPos = request.getParameter("username");
if("someone".equals(playPos)) out.print("用户名已经被注册,请更换一个用户名。");
else out.print("用户名尚未被使用,您可以继续。");
%>
  回复  更多评论
  
# 我想你原来的应该是这个 2005-11-29 15:50 | 金海龙
<%@ page contentType="text/html; charset=gb2312" errorPage="" %>

<%

String username = request.getParameter("username");

if("educhina".equals(username)) out.print("用户名已经被注册,请更换一个用户名。");

else out.print("用户名尚未被使用,您可以继续。");

%>


  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2005-11-30 12:55 | eamoi
谢谢你指出来。代码贴错了,抱歉。  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-01-13 11:54 | sonoky
ASP怎么用?我把sample1_2.jsp,sample1_2.jsp改为asp文件后就一直是请求的页面异常.难道只能用jsp吗?

<%
dim username
username=request("username")
if username="abc"
response.write("用户名已经存在!")
else
response.write("可以注册!")
end if
%>  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-01-13 14:49 | sonoky

上次的代码少了一个then
可现在是
<%
dim username
username=request("username")
if username="abc" then
response.write("用户名已经存在!")
else
response.write("可以注册!")
end if
%>
却也不行,提示系统错误!  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-01-13 14:56 | sonoky
明白了,要定义字符集,否则只能弹出非汉字

<%
Response.Charset="gb2312"
if request("username")="abc" then
response.write("用户名存在")
else
response.write("可以注册")
end if
%>
这样就OK了!!!  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-01-23 14:31 | hinz
看完你的文章对AJAX有了较完整的认识,谢谢  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-03-31 13:40 | eDust
照这样看ajax 可以和任意一种服务器端程序搭配使用!  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-04-07 08:49 | 网页上有错误
不断提示网页上有错误  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-04-17 10:26 | keepinglive
非常感谢,我想通过你的例子我已经算是入了门。哈哈,继续努力!  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-06-05 19:57 | cntime
感谢您的分享  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-06-05 19:57 | cntime
你这个AJAX提交是怎么做的啊?  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-09-18 09:36 | hongloum
谢谢  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-10-02 10:40 | wf
sample8_1.htm
读取xml怎么总提示页面异常啊
wf768012@hotmail.com  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2006-11-12 18:19 | gdg
gdfgd
gdgfd  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2007-03-09 17:40 | cqq
http_request.status == 0是为什么???  回复  更多评论
  
# re: 【原创】《AJAX开发简略》配文代码 2008-04-25 17:25 | question
@sonoky
@cqq
有没有评论以及对评论回复的例子,加上分页
  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航: