在jsp界面已列出所有客户列表,我想双击任意客户记录时,弹出一个小框,小框内把该客户所有信息以表的形式列出。利用js怎么实现呐??跪求大牛指导,,,,,
解决方案 »
- spring+hibernate 切换oracle用户(同一个数据库)
- spring-security SPEL 问题
- 在SSH中,如何加入log4日志功能,哪位朋友有这方面的资料提供一份,谢谢
- 在Hibernate中我有一个实体 有个成员属性 想通过数据库来生成 就像 Hibernate中的id 一样 不知道如何在数据库见表 和写配置文件 希望大家指
- axis调用webservice接口的问题!~~急
- 同样的机子配置为什么我的机子hibernate连接数据库sql2000那么慢的出奇?那位高手能指点一下!不胜感激!
- 设置tomcat默认站点 tomcat5.0与5.5的区别
- 没有高学历就不能学编程吗?
- 哪有能打印的PDF格式的<<thinking in java>>中文版,在线等
- XML文件是什么时候生成的?怎么生成的?放在什么地方才可以?每一个都是自己动手一句一句地写的吗?
- spring+ibatis 在业务逻辑层控制事务问题
- struts2中result redirect问题
$("td").click(function(){
var name=$(this).val();
$("#clientInfo").html("");
$("#clientInfo").appened("<span>名称:"+name+"</span>")
$("#clientInfo").show();
});
<div id="clientInfo" style="dispaly:none;">
</div>我只示范了单击名称的单元格并将层弹出将信息写入,有多个信息类似 添加即可。用到 jquery
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function showInfo(id){
// get the dom
var column = document.getElementById(id);
var cells = column.getElementsByTagName("td");
// define the var to store the value.
var id = cells.item(0);
var name = cells.item(1);
var age = cells.item(2);
var position = cells.item(3);
document.getElementById("id").innerHTML = id.innerHTML;
document.getElementById("name").innerHTML = name.innerHTML;
document.getElementById("age").innerHTML = age.innerHTML;
document.getElementById("position").innerHTML = position.innerHTML;
// the box
var box = document.getElementById("showBox");
box.style.left = (document.width - 200)/2 + "px";
box.style.top = 300;
box.style.zIndex = "9999";
box.style.display = "block";
}
</script>
<style type="text/css">
body{
padding:0px;
margin:0px;
font-size:12px;
}
table{
margin:50px auto 50px auto;
background:#09F;
}
table th{
text-align:left;
}
table td{
background:#FFF;
}
table tr{
cursor:pointer;
}
</style>
</head><body>
<table width="300px" cellpadding="1" cellspacing="1">
<tr>
<th width="25%">编号</th>
<th width="25%">姓名</th>
<th width="25%">年龄</th>
<th width="25%">职位</th>
</tr>
<tr id="cls_1" ondblclick="showInfo('cls_1')">
<td width="25%">1</td>
<td width="25%">小王</td>
<td width="25%">20</td>
<td width="25%">经理</td>
</tr>
<tr id="cls_2" ondblclick="showInfo('cls_2')">
<td width="25%">2</td>
<td width="25%">小黄</td>
<td width="25%">21</td>
<td width="25%">组员</td>
</tr>
</table>
<div id="showBox" style="position:absolute; background:#FFF;border:1px solid #666; width:200px; display:none;">
<div style="float:left; width:100%; height:15px; background:#999;">
<div style="float:right; padding-right:20px;">
<a href="javascript:void(0);" style="background:" onclick="javascript:document.getElementById('showBox').style.display = 'none';">关闭</a>
</div>
</div>
<table width="190" style="margin: 0 auto; background:#FFF">
<tr>
<td width="50%">编号</td>
<td id="id"></td>
</tr>
<tr>
<td>姓名</td>
<td id="name"></td>
</tr>
<tr>
<td>年龄</td>
<td id="age"></td>
</tr>
<tr>
<td>职业</td>
<td id="position"></td>
</tr>
</table>
</div>
</body>
</html>