jquery全選択demo
9262 ワード
<div class="demo1">
<h2>js DEMO</h2>
<input name="mm" onclick="checkItem(this, 'mmAll')" type="checkbox"><br>
<input name="mm" onclick="checkItem(this, 'mmAll')" type="checkbox"><br>
<input name="mm" onclick="checkItem(this, 'mmAll')" type="checkbox"><br>
<input name="mm" onclick="checkItem(this, 'mmAll')" type="checkbox"><br>
<input name="mm" onclick="checkItem(this, 'mmAll')" type="checkbox"><br><br>
<label><input name="mmAll" onclick="checkAll(this, 'mm')" type="checkbox"> </label>
</div>
<script type="text/javascript">
function checkAll(e, itemName)
{
var aa = document.getElementsByName(itemName);
for (var i=0; i<aa.length; i++)
aa[i].checked = e.checked;
}
function checkItem(e, allName)
{
var all = document.getElementsByName(allName)[0];
if(!e.checked) all.checked = false;
else
{
var aa = document.getElementsByName(e.name);
for (var i=0; i<aa.length; i++){
//alert(aa[i].checked);
if(!aa[i].checked) return;
}
all.checked = true;
}
}</script>
function oamCheckBoxClick(){
var flag = false;
var flag1 = true;
$("#panel-1 ul input[type='checkbox']").each(function(){
if(this.checked){
flag = true;
}else{
flag = false;
flag1 = false;
}
})
if(flag && flag1){
document.getElementById("selectAll1").checked = true;
}else{
document.getElementById("selectAll1").checked = false;
}
}
function selectAll(e,flag){
if(flag==1){
$("#panel-1 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
}else if(flag==2){
$("#panel-2 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
}else if(flag==3){
$("#panel-3 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
}else if(flag==4){
$("#panel-4 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
}
}
$(function(){
buildSelect(
"#select-sendPno",
"<s:text name='sms.jsp.common.please.select'/>",
"/sms/oamCCConf_initSendPnoSelect.action",
false,
function(obj){
//select
}
);
buildPanel("#panel-config","<s:text name='sms.jsp.common.syncParamSet'/>","null","350",true,false);
buildPanel("#panel-all"," <input type='checkbox' id='selectAll' onclick='selectAll(this,0)' /> <strong><s:text name='sms.jsp.common.selectAll'/></strong>","null","null",false,false);
buildPanel("#panel-1"," <input type='checkbox' id='selectAll1' name='selectpanel' onclick='selectAll(this,1)' /> <s:text name='sms.jsp.oam.sync.1'/>","null","null",true,false);
buildPanel("#panel-2"," <input type='checkbox' id='selectAll2' name='selectpanel' onclick='selectAll(this,2)'/> <s:text name='sms.jsp.oam.sync.2'/>","null","null",true,false);
buildPanel("#panel-3"," <input type='checkbox' id='selectAll3' name='selectpanel' onclick='selectAll(this,3)'/> <s:text name='sms.jsp.oam.sync.3'/>","null","null",true,false);
buildPanel("#panel-4"," <input type='checkbox' id='selectAll4' name='selectpanel' onclick='selectAll(this,4)'/> <s:text name='sms.jsp.oam.sync.4'/>","null","null",true,false);
//cp tree
$.ajax({
type:"post",
url:getRootPath()+"/sms/oamSipApp_initSyncCpMod.action",
dataType:"json",
success:function(obj){
$("#comboboxId").umapComboboxTree({
height:150,
data:obj
});
}
})
});
function oamCheckBoxClick(panel){
var selectflag = false;
var removeflag = true;
var selectAllflag = false;
var removeAllflag = true;
var panelstr = "";
if(panel==1){
panelstr = "#panel-1 ul input[type='checkbox']";
}else if(panel==2){
panelstr = "#panel-2 ul input[type='checkbox']";
}else if(panel==3){
panelstr = "#panel-3 ul input[type='checkbox']";
}else if(panel==4){
panelstr = "#panel-4 ul input[type='checkbox']";
}
$(panelstr).each(function(){
if(this.checked){
selectflag = true;
}else{
removeflag = false;
}
})
if(selectflag && removeflag){
if(panel==1){
document.getElementById("selectAll1").checked = true;
}else if(panel==2){
document.getElementById("selectAll2").checked = true;
}else if(panel==3){
document.getElementById("selectAll3").checked = true;
}else if(panel==4){
document.getElementById("selectAll4").checked = true;
}
}else{
if(panel==1){
document.getElementById("selectAll1").checked = false;
}else if(panel==2){
document.getElementById("selectAll2").checked = false;
}else if(panel==3){
document.getElementById("selectAll3").checked = false;
}else if(panel==4){
document.getElementById("selectAll4").checked = false;
}
}
$("[name='selectpanel'").each(function(){
if(this.checked){
selectAllflag = true;
}else{
removeAllflag = false;
}
})
if(selectAllflag && removeAllflag){
document.getElementById("selectAll").checked = true;
}else{
document.getElementById("selectAll").checked = false;
}
}
//
function selectAll(e,flag){
var selectflag = false;
var removeflag = true;
if(flag==0){
$("input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
}else if(flag==1){
$("#panel-1 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
$("[name='selectpanel'").each(function(){
if(this.checked){
selectflag = true;
}else{
removeflag = false;
}
})
}else if(flag==2){
$("#panel-2 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
$("[name='selectpanel'").each(function(){
if(this.checked){
selectflag = true;
}else{
removeflag = false;
}
})
}else if(flag==3){
$("#panel-3 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
$("[name='selectpanel'").each(function(){
if(this.checked){
selectflag = true;
}else{
removeflag = false;
}
})
}else if(flag==4){
$("#panel-4 ul input[type='checkbox']").each(function(){
this.checked = e.checked ;
})
$("[name='selectpanel'").each(function(){
if(this.checked){
selectflag = true;
}else{
removeflag = false;
}
})
}
if(flag!=0){
if(e.checked && selectflag && removeflag){
document.getElementById("selectAll").checked = true;
}else{
document.getElementById("selectAll").checked = false;
}
}
}