复选框限制器会提示用户增加选择增量

时间:2011-10-27 18:48:21

标签: javascript html

我有一个表单,允许用户只选择3个框。但是,当用户选择第四个框询问他们是否想要增加他们的选择时,我想要提示,如果他们选择是,他们被允许检查的框数将增加到5。 这是我销售的产品列表。

任何人都知道如何做到这一点。这是我的示例代码:

    <script type="text/javascript">

/***********************************************
* Limit number of checked checkboxes script- by JavaScript Kit (www.javascriptkit.com)
* This notice must stay intact for usage
* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and 100s more
***********************************************/

function checkboxlimit(checkgroup, limit){
    var checkgroup=checkgroup
    var limit=limit
    for (var i=0; i<checkgroup.length; i++){
        checkgroup[i].onclick=function(){
        var checkedcount=0
        for (var i=0; i<checkgroup.length; i++)
            checkedcount+=(checkgroup[i].checked)? 1 : 0
        if (checkedcount>limit){
            alert("Your box is full.")
            this.checked=false
            }
        }
    }
}

</script>

<p>Select your favorite two countries below:</p>

<form id="world" name="world">
<input type="checkbox" name="countries" /> USA<br />
<input type="checkbox" name="countries" /> Canada<br />
<input type="checkbox" name="countries" /> Japan<br />
<input type="checkbox" name="countries" /> China<br />
<input type="checkbox" name="countries" /> France<br />
</form>

<script type="text/javascript">

//Syntax: checkboxlimit(checkbox_reference, limit)
checkboxlimit(document.forms.world.countries, 2)

</script>

1 个答案:

答案 0 :(得分:0)

试试这个

function checkboxlimit(checkgroup, limit){

   var v_checkgroup = checkgroup;
   var v_limit = limit;

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

    v_checkgroup[i].onclick= function(){

    var checkedcount = 0;

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

    checkedcount += (v_checkgroup[i].checked)? 1 : 0

    if (checkedcount > v_limit){
    var confirmIncrease = confirm("would like to increase you selection\r\nSelect yes to increase or\r\nCancle to remove");
    if(confirmIncrease){        

    // manualy set the limit
           //  v_limit = 5; 
           // set the limit based on number of checkboxs
    v_limit = checkgroup.length; // rase the limit to the remaining


    }else{ // uncheck if they dont wish to increase the limit 
    //alert("no worries")
    this.checked=false
    }
    } }
 }
}

让我知道它是否按你的意愿工作