JQR增_批量删除_二级_全选

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.8.2.min.js"></script>
<script>
function aa() {
var name = $("#name").val();
var sex = $("#sex option:selected").text();
var date = $("#date").val();
var pro = $("#pro option:selected").text();
var city = $("#city option:selected").text();
$("table").append("<tr><td><input type='checkbox' name='ck'></td><td>" + name + "</td><td>" + sex + "</td><td>" + date + "</td><td>" + pro + "-" + city + "</td><td><button onclick='ff(this)'>删除</button></td></tr>");
}

function ff(a) {
$(a).parent().parent().remove();
}

function ckall(e) {
var es = $(":input[name='ck']");
for(var i = 0; i < es.length; i++) {
es[i].checked = e.checked;
}
}

function quanxuan() {
var ckss = $("input[name='ck']")
for(var i in ckss) {
if(ckss[i].checked == false) {
ckss[i].checked = true;
} else {
ckss[i].checked = false;
}
}
}

function piliang() {
var checks = $(":checked[name=ck]");
if(checks.length == 0) {
alert("请至少选择一条删除！");
return;
}

for(var i in checks) {
checks[i].parentNode.parentNode.remove();
}
}

$(function() {
var shengfen = [
["海淀", "大兴"],
["邯郸", "廊坊"],
["安阳", "洛阳"]
];
$("#pro").change(function() {
$("#cityx").siblings().remove();
var sheng = $(this).val(); //省份对应value
for(var i = 0; i < shengfen[sheng].length; i++) {
var $o = $("<option></option>"); //创建option标签
$o.html(shengfen[sheng][i]);
$("#city").append($o);
}
});
});
</script>
<style>
* {
padding: 0;
margin: 0;
}
</style>
</head>

<body style="margin: 0 auto;">
<div>　名字<input id="name">　性别
<select id="sex">
<option>男</option>
<option>女</option>
</select>　
出生日期<input type="date" id="date"> 　地址
<select id="pro">
<option>---请选择省份</option>
<option value="0">北京市</option>
<option value="1">河北省</option>
<option value="2">河南省</option>
</select>
<select id="city">
<option id="cityx">---请选择城市</option>
</select>
<button onclick="aa()">添加</button><br/> 　　　　　　　　　　　　　　　　　　　　　 <button onclick="quanxuan()">全选/返选</button>　
<button onclick="piliang()">批量删除</button>
</div>
<div>
<table style="padding: 1px;width: 700px;margin-top: 5px;" border="1">
<tr style="background-color: #919191;">
<td><input type="checkbox" name="chee" onchange="ckall(this)"></td>
<td>名字</td>
<td>性别</td>
<td>日期</td>
<td>地址</td>
<td>操作</td>
</tr>
</table>
</div>
</body>

</html>

JQR增_批量删除_二级_全选

猜你喜欢