转载--ajax 传送很多html字符串到前台例子
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ajax 传送多个html到前台</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<script language="javascript">
var xmlHttp;
function createXMLHttpRequest() {
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
function begin()
{
createXMLHttpRequest();
xmlHttp.onreadystatechange = processor;
xmlHttp.open("GET","display.jsp");
xmlHttp.send(null);
}
function processor()
{
if(xmlHttp.readyState == 4)
{
if(xmlHttp.status == 200){
var weatherInfo = eval("(" + xmlHttp.responseText + ")"); //解析JSON格式的服务器响应
document.getElementById("zhihui").innerHTML =weatherInfo.lastBuildDate;
document.getElementById("chill").innerHTML =weatherInfo.chill;
document.getElementById("speed").innerHTML =weatherInfo.speed;
document.getElementById("high").innerHTML =weatherInfo.high;
alert(weatherInfo.lastBuildDate);
}
}
}
</script>
</head>
<body onLoad="begin();">
<div id="zhihui">1：</div>
<table class="default">
<tr>
<td class="item">2：</td>
<td id="chill"></td>
</tr>
<tr>
<td class="item">3：</td>
<td id="high"></td>
</tr>
<tr>
<td class="item">4：</td>
<td id="speed"></td>
</tr>
</table>
</body>
</html>
display.jsp
<%@ page import="myProject.*" language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%>
<%
//String xmlPath=request.getParameter("xml");//获得xml文件路径
//String xsltPath=request.getParameter("xslt");//获得xslt文件路径
// GenerateHtmlMethod g=new GenerateHtmlMethod();//创建GenerateHtml对象
// String html1=g.getHtml("Datas1/1.xml","Datas1/1.xslt");//调用GenerateHtml对象的getHtml()方法，生成html文件并获取其源代码
// String user_forum=g.getHtml("Datas1/user_forum.xml","Datas1/user_forum.xslt");
// String special=g.getHtml("Datas1/special.xml","Datas1/special.xslt");
//String extras=g.getHtml("Datas1/Extras.xml","Datas1/Extras.xslt");
// String product_spec=g.getHtml("Datas1/product_spec.xml","Datas1/product_spec.xslt");
String ddd="dd";
String aa= "<html>" +
"<head>" +
"<style type=\"text/css\">" +
"body {TEXT-ALIGN: center;}" +
"#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; } " +
".specials{ font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:bold; text-align:left}" +
".apply{ font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;}" +
"</style>"+
"</head>" +
"<body topmargin=\"0\">" +
"<div id=\"center\" style=\"width:420px;\">" +
"<div class=\"specials\" style=\"font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:bold; text-align:left\">" +
" Specials"+
"<hr>"+
"</div>" +
"<div style=\"font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left\">" +
"Apply now and if you're approved instantly, save 30 off yourPurchase, earn 3%rewards"+
" </div>" +
"<div style=\"float:left; margin-left:20px; margin-top:15px;\">" +
"<img src=\"images/Unigroup-web-design-product.2.7_13.gif\" width=\"80\"/></div>" +
"<div style=\"float:left; margin-left:60px; margin-top:20px; line-height:19px;\" class=\"apply\">" +
"<div style=\"float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">Original Price: </div>"+
"<font color=\"#858585\">" +
"<div style=\"float:left; margin-left:15px; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">$30.00</div>" +
"</font>" +
"<br>" +
"<div style=\"float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">Discount: </div>"+
"<font color=\"#858585\">" +
"<div style=\"float:left; margin-left:15px; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">$30.00</div>" +
"</font>" +
"<br>" +
"<div style=\"float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">Discount: </div>" +
"<font color=\"#4953a0\">" +
"<div style=\"float:left; margin-left:37px; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\">-$13.28</div>" +
"</font>" +
"<br/>" +
"<b>" +
"<div style=\"float:left; font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left; line-height:19px;\"> Combo Price: </div>" +
"<div style=\"float:left; margin-left:25px; font-family:Arial, Helvetica, sans-serif; font-size:14px; text-align:left; line-height:19px; letter-spacing:1.2px;\">" +
"<font color=\"#e13333\">$16.72</font>" +
"</div>" +
"</b>" +
"</div>"+
"<div style=\"clear:both; margin-top:5px; margin-left:30px;\">" +
"<div style=\"float:left\">" +
"<img src=\"images/Unigroup-web-design-product.2.7_28.gif\"/></div>" +
"<div style=\"float:left\">" +
"<img src=\"images/Unigroup-web-design-product.2.7_29.gif\"/></div>" +
"</div>" +
"<div style=\"clear:both; margin-left:30px;\">" +
"<div style=\"float:left\">" +
"<img src=\"images/Unigroup-web-design-product.2.7_31.gif\"/></div>" +
"<div style=\"float:left\">" +
"<img src=\"images/Unigroup-web-design-product.2.7_32.gif\"/></div>" +
"</div>" +
"</div>" +
"</body>" +
"</html>" ;
%>
<%
StringBuffer result = new StringBuffer("{");
result.append("'chill':'"+aa+"',");
result.append("'lastBuildDate':'"+dd+"',"); //里面的html字符串大家任意放置，一定要通过json格式化处理
result.append("'speed':'"+aa+"',"); //否则如果html里面有一些特殊的字符有特殊的意义，系统将送不过去
result.append("'high':'"+dd+"'"); //而发生错误。希望大家注意。你可以去下个json_simple.jar
result.append("}"); //包在我博客里有下载，欢迎大家下载。下载后记得把后缀
out.print(result.toString()); //.zip改成.jar
%>
浙公网安备 33010602011771号