Html

<!DOCTYPE html>
<html>
<head>
<script src="js/angular.js"></script>
<script src="js/jquery-3.2.1.min.js"></script>
<meta charset="utf-8" />
<title></title>
<script>
function add(){
var f1=false;
var f2=false;

//判断姓名
var v_name=$("#name").val();
if(v_name==""){
alert("姓名不能为空");
f1=false;
}else if(v_name.length<3){
alert("姓名格式不正确");
f1=false;
}else{
f1=true;
}

//判断生日
var v_bir=$("#birthday").val();
if(v_bir==""){
alert("生日不能为空");
f2=false;
}else{
f2=true;
}
//得到值
var v_sex=$("#sex").val();
var v_city=$("#city").val();
var v_region=$("#region").val();
//判断姓名和生日是否同时成立
if(f1==false||f2==false){
alert("输入信息有误");
}else{
$(".table").append("<tr>" +
"<td><input type='checkbox' name='ck' ></td>" +
"<td>" + v_name +"</td>" +
"<td>" + v_sex +"</td>" +
"<td>" + v_bir +"</td>" +
"<td>" + v_city + "-" + v_region +"</td>" +
"<td><input type='button' οnclick='return del(this)' value='删除'></td>" +
"</tr>");
}
}

function del(a){
var f=confirm("确认删除吗");
if(!f){
return;
}
a.parentNode.parentNode.remove();

}

function check(){
var v_che=$("#che")[0].checked;
var ck=$("input[name='ck']");
for(var i=0;i<ck.length;i++){
ck[i].checked=v_che;
}
}

function che(){
var cks=document.getElementsByName("ck");
for(var i=0;i<cks.length;i++){
cks[i].checked=!cks[i].checked;
}
}

// function dele(){
// var ck=$("input:checked[name='ck']");
// if(ck.length==0){
// alert("请选择,然后进行删除");
// return;
// }
// var f=confirm("确认删除!!");
// if(!f){
// return;
// }
// for(var i=0;i<ck.length;i++){
// ck[i].parentNode.parentNode.remove(;)
//             }
// }



</script>

<style>
.big{
widows: 800px;
height: 600px;
text-align: center;
margin: 10px auto;
}
.table{
width: 400px;
height: 30px;
background: darkcyan;
margin: 0 auto;
}
</style>
</head>
<body ng-app="Liu" ng-controller="con">
<div class="big">
姓名:<input type="text" id="name"/>
性别:<select id="sex">
 <option>男</option>
 <option>女</option>
   </select>
生日:<input type="date" id="birthday"/>
住址:<select id="city">
  <option>北京</option>
  <option>河北</option>
  <option>河南</option>
  </select>
  <select id="region">
   <option>西二旗</option>
   <option>邯郸</option>
   <option>新乡</option>
  </select>
  <input type="button" value="添加数据" οnclick="add()"/><br /><br />
  <input type="button" value="全选/反选" οnclick="che()"/>
  <input type="button" value="批量删除" οnclick="dele()"/><br /><br />
  <table border="1" cellspacing="0" class="table">
   <tr>
    <td width="70px"><input type="checkbox" οnclick="check()" id="che"></td>
    <td width="70px">姓名</td>
    <td width="70px">性别</td>
    <td width="70px">生日</td>
    <td width="70px">住址</td>
    <td width="70px">删除</td>
   </tr>
 
 
  </table>
  
  
  
</div>

</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值