JS檢查單選框、複選框是否選擇，並限制複選框個數

時間  2021-08-13
標籤 javascript html java ide post spa orm xml htm 欄目 JavaScript 简体版
原文   原文鏈接

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS檢查單選框、複選框是否選擇，並限制複選框個數</title>
<script type="text/javascript">
var N_iMaxSelected = 2;
var N_iNumChecked = 0;javascript

function N_doCheck(N_ctrl) {
 if(N_ctrl.checked){
  N_iNumChecked++;
  //window.alert("iNumChecked++" + iNumChecked);
 }
 else{
  N_iNumChecked--;
  //window.alert("iNumChecked--" + iNumChecked);
 }
 
 if(N_iNumChecked > N_iMaxSelected){
  N_ctrl.checked = false;
  N_iNumChecked--;
  window.alert('最多能夠選擇2個較喜歡的欄目');
 }
}html

 

var A_iMaxSelected = 5;
var A_iNumChecked = 0;java

function A_doCheck(A_ctrl) {
 if(A_ctrl.checked){
  A_iNumChecked++;
  //window.alert("iNumChecked++" + iNumChecked);
 }
 else{
  A_iNumChecked--;
  //window.alert("iNumChecked--" + iNumChecked);
 }
 
 if(A_iNumChecked > A_iMaxSelected){
  A_ctrl.checked = false;
  A_iNumChecked--;
  window.alert('最多能夠選擇5篇較喜歡的文章');
 }
}ide

 

function check(){
 var noSelect= false;
 
 Vote_A_ID=document.getElementsByName("Vote_A_ID")
 Vote_N_ID=document.getElementsByName("Vote_N_ID")
 
 for(var i=0;i<Vote_A_ID.length;i++){
  if(Vote_A_ID[i].checked==true){
   noSelect=true;
   break;
  }
 }
 
 if(noSelect==false){
  alert("請選擇最喜歡的1-5篇文章！");
  return (false);
 }
 
 noSelect= false;
 var w=1
 for(var i=0;i<Vote_N_ID.length;i++){
  if(Vote_N_ID[i].checked==true){
   if(w>1){
    noSelect=true;
    break;
   }
   w=w+1
  }
 }
 
 if(noSelect==false){
  alert("請選擇2個較喜歡欄目！");
  return (false);
 }
 
 document.Vote_Add.submit()
}
</script>
</head>post

<body>
<form action="" method="post" name="Vote_Add" id="Vote_Add" >
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#999999">
    <tr>
      <td height="30" align="left" bgcolor="#FFFFFF" style="padding-left:10px;"><h1><strong>1、請選擇您最喜歡的&nbsp;1-5&nbsp;篇文章</strong></h1></td>
    </tr>
    <tr>
      <td bgcolor="#FFFFFF" style="padding:10px 20px 10px 20px;"><table width="95%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td height="30" colspan="3" align="left" style="padding-left:25px;"><h1><strong>一、第一章</strong></h1></td>
        </tr>
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="1" />
          </td>
          <td width="10%" height="25" align="center">第一節</td>
          <td width="80%" height="25" align="left">友情連接交接(ehuanw.com)一</td>
        </tr>
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="2" />
          </td>
          <td width="10%" height="25" align="center">第二節</td>
          <td width="80%" height="25" align="left">友情連接交接(ehuanw.com)二</td>
        </tr>
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="3" />
          </td>
          <td width="10%" height="25" align="center">第三節</td>
          <td width="80%" height="25" align="left">友情連接交接(ehuanw.com)三</td>
        </tr>
      </table>
          <table width="95%" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td height="30" colspan="3" align="left" style="padding-left:25px;"><h1><strong>一、第二章</strong></h1></td>
            </tr>
            <tr>
              <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="4" />
              </td>
              <td width="10%" height="25" align="center">第一節</td>
              <td width="80%" height="25" align="left">蔬菜基地(shucaijd.com)一</td>
            </tr>
            <tr>
              <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="5" />
              </td>
              <td width="10%" height="25" align="center">第二節</td>
              <td width="80%" height="25" align="left">蔬菜基地(shucaijd.com)二</td>
            </tr>
            <tr>
              <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_A_ID" id="Vote_A_ID" value="6" />
              </td>
              <td width="10%" height="25" align="center">第三節</td>
              <td width="80%" height="25" align="left">蔬菜基地(shucaijd.com)三</td>
            </tr>
        </table></td>
    </tr>
    <tr>
      <td height="30" align="left" bgcolor="#FFFFFF" style="padding-left:10px;"><h1><strong>2、請選擇您最喜歡的&nbsp;2&nbsp;個欄目</strong></h1></td>
    </tr>
    <tr>
      <td bgcolor="#FFFFFF" style="padding:10px 20px 10px 20px;"><table width="95%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_N_ID" id="Vote_N_ID" value="1" /></td>
          <td width="90%" height="25" align="left" style="padding-left:10px;">第一章</td>
        </tr>
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_N_ID" id="Vote_N_ID" value="2" /></td>
          <td width="90%" height="25" align="left" style="padding-left:10px;">第二章</td>
        </tr>
        <tr>
          <td width="10%" height="25" align="right"><input type="checkbox" name="Vote_N_ID" id="Vote_N_ID" value="3" /></td>
          <td width="90%" height="25" align="left" style="padding-left:10px;">第三章</td>
        </tr>
      </table></td>
    </tr>
    <tr>
      <td height="40" align="center" bgcolor="#FFFFFF"><input name="button" type="button" value=" 投 票 " />
      </td>
    </tr>
  </table>
</form>
</body>
</html>
 ui

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程