ajax使用
页面自动查询
网上找的代码，修改了一下，代码不好：但是基本体现了ajax的原理，有时间再修正一下，整理
ajax关键是回调函数的写法，服务端要返回数据，以往服务端是返回一个页面
index.jsp
<%@pagecontentType="text/html;charset=UTF-8"language="java"%>
<html>
<HEAD><TITLE>用户登录页面</TITLE>
<scripttype="text/javascript">
varxmlHttp;
varid;
functiontrim(str)
{
vart=str.replace(/(^\s*)|(\s*$)/g,"");//用正则表达式将前后空格
returnt.replace(/(^ *)|( *$)/g,"");//用空字符串替代。
}
functioncreateXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}
elseif(window.XMLHttpRequest){
xmlHttp=newXMLHttpRequest();
}
}
functionvalidate(){
createXMLHttpRequest();
varurl="/del1.jsp";
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=callback;
xmlHttp.send(null);
}
functioncallback(){
//alert(xmlHttp.readyState);
if(xmlHttp.readyState==4){
show();
setTimeout("validate()",3600);
}
}
functionshow(){
varxmlDoc=xmlHttp.responseXML;
varyan=xmlDoc.getElementsByTagName("content");
varta="";
for(vari=0;i<yan.length;i++){
vary=yan[i];
varname=y.childNodes[0].firstChild.data;
ta+="<tr><tdWIDTH=100%height=10><tablewidth=100%height=5%cellpadding=1cellspacing=1border=1><tr><td> "+name+"</td><tdwidth=20%nowrapalign=right>11</td></tr></table></td></tr>";
}
document.getElementById("res").innerHTML=ta;
}
functionstartmarquee(lh,speed,delay){
validate();
varp=false;
vart;
varo=document.getElementById("res");
o.innerHTML+=o.innerHTML;
o.style.marginTop=0;
o.onmouseover=function(){p=true;}
o.onmouseout=function(){p=false;}
functionstart(){
t=setInterval(scrolling,speed);
if(!p)o.style.marginTop=parseInt(o.style.marginTop)-1+"px";
}
functionscrolling(){
if(parseInt(o.style.marginTop)%lh!=0){
o.style.marginTop=parseInt(o.style.marginTop)-1+"px";
if(Math.abs(parseInt(o.style.marginTop))>=o.scrollHeight/2)o.style.marginTop=0;
}else{
clearInterval(t);
setTimeout(start,delay);
}
}
setTimeout(start,delay);
}
</script>
</head>
<BODYonLoad="startmarquee(90-18,40,0)">
<tableheight=44cellSpacing=0cellPadding=0width=870align=centerbgColor=#ffffffborder=0>
<tr>
<tdvAlign=centeralign=middle>
<tableheight=33cellSpacing=1cellPadding=0width=860align=centerborder=0>
<tr>
<tdvAlign=center>
<formname="loginform"action="/login.do"method="post">
用户名：<Inputstyle="FONT-WEIGHT:bold;FONT-SIZE:11px;COLOR:#cc6600;FONT-FAMILY:Verdana;BACKGROUND-COLOR:#f9f9f9"tabIndex=1size=13name="username">
密码：<Inputstyle="FONT-WEIGHT:bold;FONT-SIZE:11px;COLOR:#cc6600;FONT-FAMILY:Verdana;BACKGROUND-COLOR:#f9f9f9"tabIndex=1type=passwordsize=13value=""name="password">
<Inputclass="button2"type="submit"value=口令登录name=B12>
<Inputclass="button2"type="reset"value="重置"name=reset2>
</form>
</td>
</tr>
</table>
</td>
</tr>
</table>
<divid="res"></div>
</BODY>
</html>
conn.jsp
<%@pagecontentType="text/html;charset=utf-8"import="java.sql.*,javax.naming.Context,javax.naming.InitialContext"
errorPage=""%>
<%!Connectionconn=null;
Statementstmt=null;
ResultSetrs=null;
publicvoidjspInit(){
try{
Class.forName("oracle.jdbc.driver.OracleDriver");
//建立连接
conn=DriverManager.getConnection(
"jdbc:oracle:thin:@1.1.1.1:1521:sid","user","pass");
//ContextinitCtx=newInitialContext();
//Contextctx=(Context)initCtx.lookup("java:comp/env");
//获取连接池对象
//Objectobj=(Object)ctx.lookup("jdbc/javasky");
//类型转换
//javax.sql.DataSourceds=(javax.sql.DataSource)obj;
//conn=ds.getConnection();
stmt=conn.createStatement();
}catch(Exceptionex){
System.out.println(ex.toString());
}
}
publicvoidExec(Stringsql){
jspInit();
try{
stmt.executeUpdate(sql);
}catch(Exceptione){
System.out.print(e.toString());
}
}
publicResultSetgetRs(Stringsql)throwsSQLException{
jspInit();
try{
rs=stmt.executeQuery(sql);
returnrs;
}catch(Exceptione){
System.out.print(e);
returnnull;
}
}
publicResultSetexecuteQuery(Stringsql)throwsException{
jspInit();
try{
sql=newString(sql.getBytes("GBK"),"ISO8859_1");
stmt=conn.createStatement(
java.sql.ResultSet.TYPE_SCROLL_INSENSITIVE,
java.sql.ResultSet.CONCUR_READ_ONLY);
rs=stmt.executeQuery(sql);
}catch(SQLExceptionex){
System.out.println("sql.executeQuery:"+ex.getMessage());
}
returnrs;
}
publicStringgetS(StringStr){
try{
byteb[]=Str.getBytes("ISO-8859-1");
Str=newString(b,"UTF-8");
}catch(Exceptionee){
ee.printStackTrace();
}
returnStr;
}%>
del1.jsp
<%@pagecontentType="text/html;charset=utf-8"import="java.sql.*,java.util.*"errorPage=""%>
<%@includefile="conn.jsp"%>
<%
try{
ResultSetrs=getRs("select*fromnewsorderbynewsIddesc");
StringBuffercontent=newStringBuffer("");
response.setContentType("text/xml");
response.setHeader("Cache-Control","no-cache");
content.append("<?xmlversion=\"1.0\"encoding=\"UTF-8\"?>");
content.append("<contents>");
while(rs.next()){
StringnewsName=rs.getString("newsName");
content.append("<content>");
content.append("<name>"+newsName+"</name>");
content.append("</content>");
}
content.append("</contents>");
out.print(content);
}
catch(Exceptione){
e.printStackTrace();
}
%>
相关推荐
结束数据方法的参数，该如何定义？-- 集合为自定义实体类中的结合属性，有几个实体类，改变下标就行了。<input id="add" type="button" value="新增visitor&quo