如：在JSP页面中显示完整代码如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<%@ page
language="java"
contentType="text/htmlcharset=UTF-8"
pageEncoding="UTF-8"
%>
<%@page import="java.sql.*"%>
<center>
<H1><font color="blue" size="12">管理中心</font></H1>
<HR />
<table width="80%" border="1">
<tr>
<th>ID</th>
<th>书名</th>
<th>作者</th>
<th>价格</th>
<th>删除</th>
</tr>
<%
// 数据库的名字
String dbName = "zap"
// 登录数据库的用户名
String username = "sa"
// 登录数据库的密码
String password = "123"
// 数据库的IP地址，本机可以用 localhost 或者 127.0.0.1
String host = "127.0.0.1"
// 数据库的端口，一般不会修改，默认为1433
int port = 1433
String connectionUrl = "jdbc:sqlserver://" + host + ":" + port + "databaseName=" + dbName + "user=" + username
+ "password=" + password
//
//声明需要使用的资源
// 数据库连接，记得用完了一定要关闭
Connection con = null
// Statement 记得用完了一定要关闭
Statement stmt = null
// 结果集，记得用完了一定要关闭
ResultSet rs = null
try {
// 注册驱动
Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver")
// 获得一个数据库连接
con = DriverManager.getConnection(connectionUrl)
String SQL = "SELECT * from note"
// 创建查询
stmt = con.createStatement()
// 执行查询，拿到结果集
rs = stmt.executeQuery(SQL)
while (rs.next()) {
%>
<tr>
<td>
<%=rs.getInt(1)%>
</td>
<td>
<a href="prepareupdate?ID=<%=rs.getInt("ID")%>" target="_blank"><%=rs.getString(2)%></a>
</td>
<td>
<%=rs.getString(3)%>
</td>
<td>
<%=rs.getString(4)%>
</td>
<td>
<a href="delete?ID=<%=rs.getInt("ID")%>" target="_blank">删除</a>
</td>
</tr>
<%
}
} catch (Exception e) {
// 捕获并显示异常
e.printStackTrace()
} finally {
// 关闭我们使用过的资源
if (rs != null)
try {
rs.close()
} catch (Exception e) {}
if (stmt != null)
try {
stmt.close()
} catch (Exception e) {}
if (con != null)
try {
con.close()
} catch (Exception e) {}
}
%>
</table>
<a href="insert.jsp">添加新纪录</a>
</center>
html只能通过ajax接口跟后台数据库接口通信，然后取出来的数据在页面上显示。以下是一个例子：
html文件suggest.html：
<html>
<head>
<meta http-equiv="content-type" content="text/htmlcharset=UTF-8">
<script language="JavaScript" type="text/javascript" src="ajax_search.js"></script>
<style type="text/css" media="screen">
body {
font: 11px arial
}
.suggest_link {
background-color: #FFFFFF
padding: 2px 6px 2px 6px
cursor:hand
}
.suggest_link_over {
background-color: #E8F2FE
padding: 2px 6px 2px 6px
}
#search_suggest {
position:relative
background-color: #FFFFFF
text-align: left
border: 1px solid #000000
left: -12px
top: 1px
height: 74px
width: 170px
display:none
}
</style>
</head>
<body background="bg.gif">
<center>
<h3>实现搜索提示</h3>
<div style="width: 500px">
<input type="text" id="txtSearch" name="txtSearch" onKeyUp="searchSuggest()" autocomplete="off" />
<input type="submit" id="cmdSearch" name="cmdSearch" value="搜索"/><br />
<div id="search_suggest"></div>
</div>
</center>
</body>
</html>
ajax_search.js：
var searchReq = createAjaxObj()
function createAjaxObj()
{
var httprequest=false
if (window.XMLHttpRequest) //为非IE浏览器生成XmlHttpRequest对象
{
httprequest=new XMLHttpRequest()
if (httprequest.overrideMimeType) httprequest.overrideMimeType('text/xml')
}
else if (window.ActiveXObject) //为IE浏览器生成XmlHttpRequest对象
{
try
{
httprequest=new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e)
{
try
{
httprequest=new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
return httprequest
}
function searchSuggest()
{
if (searchReq.readyState == 4 || searchReq.readyState == 0)
{
第一步：将取出的标签转换成字符串，比如：
var html = "<div>这就是标签字符串</div>"
第二步：
在html中的节点插入：
document.body.innerHTML = html
就完成了
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）