转载自：http://blog.csdn.net/jdq819/article/details/5554683
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script src="My97DatePicker/WdatePicker.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<table width="100%">
<tbody>
<tr>
<th>
姓名
</th>
<th>
性别
</th>
<th>
出生年月
</th>
<th>
身份证号
</th>
<th>
联系电话
</th>
<th>
操作
</th>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td >
</td>
<td >
</td>
<td >
</td>
<td >
</td>
<td >
</td>
<td >
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
</tbody>
</table>
<%--<div style="background-color:ECE9D8;">
--%></form>
</body>
</html>
<script type="text/javascript">
$(function() {
//设置table隔行换色
$("tbody tr:even").css("background-color", "ECE9D8");
var j = 0;
//换到tbody里的所有tr each是迭代所有的行
var trs = $("tbody tr").each(function() {
if (j > 0) {
var i = 0;//i代表是第几列
//$(this).children() 找到一行里的td 每次迭代的都是整行
$(this).children().each(function() {
if (i == 0) {
$(this).html("<input type='text' id='txtname" + i + "'>");
} else if (i == 1) {
var sex = "<input id='rdman" + i + "' type='radio' name='sex" + i + "'/>男 <input id='rdwomen" + i + "' type='radio' name='sex" + i + "'>女";
$(this).html(sex);
} else if (i == 2) {
var birthday = "<input type='text' readonly='true' id='txtBirthday" + i + " ' οnblur='checkbirthday(this)' onfocus = /"WdatePicker({dateFmt:'yyyy年M月d日',maxDate:'2009-01-01'})/">";
$(this).html(birthday);
} else if (i == 3) {
$(this).html("<input type='text' id='txtID" + i + "'>");
} else if (i == 4) {
$(this).html("<input type='text' id='txtphone" + i + "'>");
} else if (i == 5) {
$(this).html("<a href='#'>添加</a>");
}
i++;
});
}
j++;
});
//设置table里的input[text]的宽
$("input[type='text']").css("width", "150px");
//给单元格里的a标签添加事件
$("td a").click(function() {
var tr = $(this).parent().parent();//找到a当前所在的行
var name = tr.children().eq(0).children().val();//找到第一个单元格里控件的值
if ($.trim(name) == "") {
alert("请输入姓名");
return false;
}
var sex;
var man = tr.children().eq(1).children().get(0).checked;
var women = tr.children().eq(1).children().get(1).checked;
if (man) {
sex = "男";
}
else if (women) {
sex = "女";
}
else {
alert("请选择性别");
return false;
}
var birthday = tr.children().eq(2).children().val();
var ID = tr.children().eq(3).children().val();
var phone = tr.children().eq(4).children().val();
if ($.trim(birthday) == "") { alert("请输入出生年月"); return false; }
if ($.trim(ID) == "") { alert("请输入身份证号"); return false; }
if ($.trim(phone) == "") { alert("请输入联系电话"); return false; }
//提交的路径 并把所有的值以url参数的形式传到服务器端
var url = 'Action/AddBasicInfo.ashx?Operating=add&name=' + name + "&birthday=" + birthday + "&sex=" + sex + "&phone=" + phone + "&id=" + ID + "&time=" + (new Date).getSeconds();
url = encodeURI(url);//给url编码 处理中文乱码的问题
$.get(url, null, function(data) {
alert(data);
tr.hide("slow");//隐藏当前行
});
});
});
</script>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
