<!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=gb2312" />
<title>无标题文档</title>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<style type="text/css">
<!--
*{margin:0; padding:0; font-size:12px;}
.main{width:400px; margin:40px auto;}
.main table{border:0; border-collapse:collapse; width:100%;}
.main table td{height:25px; border:solid 1px #999; padding:0 2px;}
.tips{background:#f00; color:#fff; height:16px; padding-top:4px; width:160px; text-align:center; visibility:hidden;
margin:0 auto;}
-->
</style>
<script type="text/javascript">
$(document).ready(function(){
$(":button").css({"border":"solid 1px #999","margin-top":"10px","padding":"3px 5px 0"});
$(":button").click(function(){
if($(":checkbox").is(":checked")){
alert("你可以进行下一步操作了...");
}
else{
$(".tips").css("visibility","visible");
setTimeout(function(){$(".tips").css("visibility","hidden");},5000);
}
})
})
</script>
</head>
<body>
<div class="main">
<div class="tips">请选择你要操作的用户！</div>
<table>
<col style="text-align:center;" />
<col span="3" />
<tr>
<td width="34"><input type="checkbox" /></td>
<td width="166">张三</td>
<td width="100">20</td>
<td width="100">汉族</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>令狐冲</td>
<td>22</td>
<td width="100">汉族</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>黄蓉</td>
<td width="100">20</td>
<td width="100">汉族</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>松江</td>
<td>22</td>
<td width="100">汉族</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>白素贞</td>
<td width="100">20</td>
<td width="100">汉族</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>许仙</td>
<td>22</td>
<td width="100">汉族</td>
</tr>
</table>
<div><input type="button" value="更改" /></div>
</div>
</body>
</html>
- 1
- 2
前往页