自己做的非常简陋的点选学校的效果 -

shayuye

浏览: 14363 次
性别:
来自: 济南

最近访客更多访客>>

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (12)

社区版块

存档分类

自己做的非常简陋的点选学校的效果

Access Ajax J#Servlet XHTML

<!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>注册页面</title>
<link href="../css/validator.css" type="text/css" rel="stylesheet"></link>
<style type="text/css">
body{
margin:0px auto;
text-align:center;
}
#pop{
background-color:blue;
margin-top:-250px;
}
</style>
<script type="text/javascript" src="jquery.js" ></script>
<script type="text/javascript">
var TableCol=4;
var access=false;
var ja=[];
ja[0]="北京大学";
ja[1]="山东大学";
ja[2]="齐鲁软件学院";
ja[3]="青岛大学";
ja[4]="山东师范大学";
$(document).ready(function (){
alert("ss");
$('#selectSchool').click(function(){
alert("ss");
if(access)
{
$('#pop').show();
}
else
{
/**
$.ajax({
url:'../servlet/GetSchoolname',
type:'GET',
data:{'q':'',time:new Date()},
dataType:'text',
success:function(data){
data=unescape(unescape(data));
ja=data.split("\n");
TableCol=getCol(ja.length);
showSchool();
}
});
*/
TableCol=getCol(ja.length);
showSchool();
}
})
function showSchool(){
var table=$('table',$('#pop'));
$('#pop').html(generate()).show();
$('div#title>a').click(function (){
$('#pop').hide();
});
$('table td',$('#pop')).each(function (i){
$(this).click(function (){
$('#school').val($(this).html());
$('#pop').hide();
});
})
access=true;
}
function generate()
{
var res="";
res+="<div id='title'><a href='#'><font color='red'>关闭</font></a></div>";
var i,j=0;
res+="<div id='content'><table class='schoolTable' border=1>";
while(j<(ja.length/TableCol))
{
res+="<tr>";
for (i = 0; i < TableCol; i = i + 1) {
if ((j*TableCol+i) >= ja.length)
{
break;
}
res+="<td>";
res+=ja[j*TableCol+i];
res+="</td>";
}
res+="</tr>";
j++;
}
res+="</table></div>";
return res;
}
function getCol(num)
{
for(var i=0;i<num;i=i+1)
{
if(i*i>num)
{
break;
}
}
return i;
}
</script>
</head>
<body>
<form method="post" name="form1" id="form1" >
<table border="0px" style="font-size:12px" width="400px">
<tr>
    <td>所在学校:</td>
    <td><input name="school" type="text" id="school" maxlength="50" /></td>
    <td><input type="button" id="selectSchool" value="选择学校"/></td>
</tr>

   <tr>
    <td colspan="3" align="left" >
<td width="50px"><input type="submit" name="button" id="button" value="提交" /></td>
</tr>
</table>
<div id="pop"></div>
</form>
</div>
</body>
</html>

分享到：