js如何获取checkbox的累加值,高分救助,在线等

发布网友发布时间：2022-05-05 20:58

共2个回答

热心网友时间：2022-04-26 07:51

<!doctype html>

<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form id="form">
<input type="checkbox" value="5">5元
<input type="checkbox" value="2">2元
<input type="checkbox" value="3">3元
<input type="checkbox" value="5">5元
<input type="checkbox" value="10">10元
<input type="checkbox" value="5">5元
</form>
<script type="text/javascript">
var form = document.getElementById("form");
var $x = 10;

//用于处理“选中”事件的函数
var checkHandler = function(event){
//被选中的金额累加到sum
var sum = 0;
var boxes = document.getElementById("form").elements;
for(var i=0;i<boxes.length;i++){
if(boxes[i].checked){//判断是否被选中，如果是，就累加
sum += parseInt(boxes[i].value);
}
}
//console.log("sum="+sum);
if(sum > $x){
alert("金额超出 "+ $x +" 元");
//如果超出金额，则取消选中
event.target.checked=undefined;
}
}

//用于设置最大值 $x 的函数
function setThreshold(t){
$x = 10;
}
                function addHandler(){
                for(var i=0;i<form.elements.length;i++){
form.elements[i].onclick = checkHandler;
}
                }

setThreshold(10);
addHandler();
</script>
</body>
</html>

追问

我也写了一种，不过现在有个问题，就是怎么加到项目里，他项目里原有的js调用格式如下

热心网友时间：2022-04-26 09:09

<!DOCTYPE html>
<html lang="en">
<head><script src="jquery.js"></script>
    <meta charset="UTF-8">
    <title>文哥讨厌IE</title>
    <script type="text/javascript">
    $(document).ready(function(){
        var $x=2;//<s >
        $(".submit").click(function(){
        var sum=0;
        $(":checked").each(function(){
                if($("this :checked")){
                    sum+=parseInt($(this).next().text());
                }
        });
        if(sum>$x){
            $(":checked").removeAttr("checked","checked");
            alert("您勾选的金额超出"+$x+"元,请重新选择");
            return false;
        }
    });
});
</script>
</head>
<body>
<form>
    <input type="checkbox"/><span>0元</span>
    <input type="checkbox"><span>1元</span>
    <input type="checkbox"><span>2元</span>
    <input type="checkbox"><span>3元</span>
    <input type="checkbox"><span>4元</span>
    <input type="submit" value="submit" class="submit">
</form>
</body>
</html>