按钮全选

2017-07-21

JavaScript

按钮全选

（1）js代码

//全选功能代码

function test() {
var c1s = document.getElementsByName("c1");
var qx = document.getElementById("qx");
if(qx) {
for(var i = 0; i < c1s.length; i++) {

//复选框被选中
c1s[i].checked = 1;
}

}
}

}

//计算价格功能的实现

onload = function() {

//获得按钮
var btn = document.getElementById("btn");

//给按钮添加点击事件
btn.onclick = function() {

//获得复选框
var c1s = document.getElementsByName("c1");
var sum = 0;
for(var i = 0; i < c1s.length; i++) {
if(c1s[i].checked) {
sum += parseInt(c1s[i].value);
}
}
alert(sum);
}
}

//删除功能的实现

function sc(anode){
/*先找到tr的父标签*/
var tbody=document.getElementsByTagName("tbody")[0];
/*通过兄弟关系找到tr*/
var tr=anode.parentNode.parentNode;
/*删除tr所在的这一行*/
tbody.removeChild(tr);
}

//添加功能的实现

function addtr(){
/*创建tr d createElement用来创建标签*/
var tr=document.createElement("tr");
var td1=document.createElement("td");
var td2=document.createElement("td");
var td4=document.createElement("td");
/*给td添加数据*/

td1.innerHTML="<input type='checkbox' name='c1' value='12' />";
td2.innerHTML="面片12";
td4.innerHTML="<a href='#' onclick='sc(this)'>删除</a>";
/*将td放入tr中 appendChild是用来给父标签中放入子标签*/
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td4);
var tbody=document.getElementsByTagName("tbody")[0];
tbody.appendChild(tr);
var last=document.getElementById("s4");/*获取最后一行*/
// tbody.insertBefore(tr,last);
// tbody.insertCell(tr,last)
}

//多删功能的实现

function delet() {
var cls = document.getElementsByName("c1");

for(var i = 0; i < cls.length; i++) {

if(cls[i].checked) {
var tbody = document.getElementsByTagName("tbody")[0];

var tr = cls[i].parentNode.parentNode;

tbody.removeChild(tr);
i--;

}

}
}