程序人生

Ajax简单实例(java版)

时间:2013/9/15 15:34:17  作者:www.solgle.com  来源:说歌社区  查看:442  评论:0
内容摘要:#test.html ajax test
#test.html
<!-
在tomcat下面测试中文可正常显示
->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>

<HEAD>
 <TITLE> ajax test </TITLE>

</HEAD>
<script src="ajaxaction.js"></script>

<BODY>
<form>
<input type="text" name="content">
<input type="button" name="clickmeforget" value="clickme" onclick="sendGetAction('test.jsp?content=中文',stateChanged)">
<input type="button" name="clickmeforpost" value="clickme" onclick="testPostAction('test.jsp',this.form.content.value,stateChanged)">
</form>
 <span id="textHit"></span>
 <script>
 function testPostAction(url,value,stateChanged){
 value = encodeURI(value);
 value = encodeURI(value);//两次,很关键,解决中文问题

 sendPostAction(url,"content="+value,stateChanged);
 };
 function stateChanged(){
 if (xmlHttp.readyState==4)
 {
 document.getElementByIdx("textHit").innerHTML=xmlHttp.responseText;
 };
 }
 </script>
</BODY>
</HTML>

#test.jsp

<%@ page contentType="text/html;charset=gb2312"%>
<%
String content = request.getParameter("content");
out.println(java.net.URLDecoder.decode(content,"UTF-8"));
out.println("中文");
%>

#ajaxaction.js

//定义全局的xml对象
var xmlHttp = null;
function GetXmlHttpObject()
{

 var xmlHttp=null;
 try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
 catch (e)
 {
 // Internet Explorer
 try
 {
 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
 }
 catch (e)
 {
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 }
if(xmlHttp == null)
 alert("对不起,您的浏览器不支持Ajax");
 return xmlHttp;
}

function sendGetAction(url,myStateChanged){
 //get传送

if (xmlHttp==null)
 {
 xmlHttp=GetXmlHttpObject();

 }

 //指定响应函数
 xmlHttp.onreadystatechange=myStateChanged;
 xmlHttp.open("GET",url,true);
 xmlHttp.send(null);
}

function getQuery(form){
//将表单元数拼成Query条件

 queryString="";
 

 var numberElements = form.elements.length;
 for(var i = 0; i < numberElements; i++) {
 if(i < numberElements-1) {
 queryString += form.elements[i].name+"="+
 encodeURI(encodeURI(form.elements[i].value))+"&";
 } else {
 queryString += form.elements[i].name+"="+
 encodeURI(encodeURI(form.elements[i].value));
 }

 }
return queryString;
 

}

function sendGetForm(form,myStateChanged){
 //表单GET提交
 var queryString = getQuery(form);
 var url = form.action;
 url = url+"?"+queryString+"&sid="+Math.random();
 sendGetAction(url,myStateChanged);

}

function sendPostAction(url,strQuery,myStateChanged){
//post传送

 if (xmlHttp==null)
 {
 xmlHttp=GetXmlHttpObject();

 }
 xmlHttp.open("POST",url,true);
 xmlHttp.onreadystatechange=myStateChanged;
 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
 xmlHttp.send(strQuery);//发送请求
};

function sendPostForm(form,myStateChanged){
//表单post提交

 var queryString = getQuery(form);
 var url = form.action;
 sendPostAction(url,queryString,myStateChanged);

}

 

标签:Ajax简单实例(java版) 

solgle.com 版权所有,欢迎分享!!!

相关文章
    相关评论
     img1 img2 img3 img4 img5 img6 img7 img8 img9 img10
    评论者:      验证码:  点击获取验证码
       Copyright © 2013-2028 solgle.com,All rights reserved.[solgle.com] 公安机关备案号:51010802000219
    Email:solgle@solgle.com; weixin:cd1008610000 ICP:蜀ICP备14011070号-1