checkbox 最多选择5个

 

代码初始化选择前5个，没有优化实现。

<input id="ckb_userId" name="ckb_userId" value="${var.user_id },${var.user_name }" type="checkbox" onclick="fn_checkbox(this);" />

//checkbox 最多选择5个

var checkedFlag = 0;

var checkMax = 5;

function fn_checkboxFive(){

var obj = document.getElementsByName("ckb_userId");

for (var k = 0; k < obj.length; k ++ )

 {

if(k < 5) {

obj[k].checked = true;

checkedFlag = k+1;

}else{

if( ! obj[k].checked)obj[k].disabled = true;

}

 

 }

}

//初始化选择前5个

fn_checkboxFive();

//判断选择个数是否大于5

function fn_checkbox(checkbox){

   var obj = document.getElementsByName("ckb_userId");

   if (checkbox.checked && checkedFlag <= checkMax - 1)

   {

 checkedFlag ++ ;

 if (checkedFlag == checkMax)

 {

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

{

if( ! obj[i].checked)obj[i].disabled = true;

}

 }

   }

   else if ( ! checkbox.checked)

   {

 for (var j = 0; j < obj.length; j ++ )

 {

if( ! obj[j].checked)obj[j].disabled = false;

 }

 checkedFlag -- ;

          if( checkedFlag == 0) alert('至少选择一个用户！');

   }

} 

 

//执行查询按钮

function fn_findUserInfo() {

if(checkedFlag == 0){

alert('至少选择一个用户！ ');

}else{

document.forms[0].action = "${pageContext.request.contextPath}/findUserInfo.do";

  document.forms[0].submit();

}

}