使用JQuery检查随机复选框

时间:2012-08-17 10:32:01

标签: javascript jquery html

我知道如何使用ID和CLASS检查和取消选中特定的复选框。 但我想使用Jquery随机选择10复选框。

每次我都会有100,40或XX个复选框。 (HTML复选框) 它可能是100复选框或50复选框或其他东西。每次都会有所不同。

我想在按下按钮时随机选中10个复选框。 用户可以手动选择这10个复选框。或者他们只需按下随机按钮。

我正在使用Jquery。

$(':checkbox:checked').length;

但我想找到所有复选框的长度,我想检查10个随机复选框。

1 个答案:

答案 0 :(得分:3)

你在找这样的东西吗?

http://jsfiddle.net/qXwD9/

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

    <script>
        //Creating random numbers from an array
        function getRandomArrayElements(arr, count) {
            var randoms = [], clone = arr.slice(0);
            for (var i = 0, index; i < count; ++i) {
                index = Math.floor(Math.random() * clone.length);
                randoms.push(clone[index]);
                clone[index] = clone.pop();
            }
            return randoms;
        }

        //Dummy array
        function createArray(c) {
            var ar = [];
            for (var i = 0; i < c; i++) {
                ar.push(i);
            }
            return ar;
        }

        //check random checkboxes
        function checkRandom(r, nodeList) {
            for (var i = 0; i < r.length; i++) {
                nodeList.get(r[i]).checked = true;
            }
        }

        //console.log(getRandomArrayElements(a, 10));

        $(function() {

            var chkCount = 100;
            //this can be changed

            var numberOfChecked = 10;
            //this can be changed

            var docFrag = document.createElement("div");

            for (var i = 0; i <= chkCount; i++) {
                var chk = $("<input type='checkbox' />");
                $(docFrag).append(chk);
            }

            $("#chkContainer").append(docFrag);

            $("#btn").click(function(e) {

                var chks = $('input[type=checkbox]');

                chks.attr("checked", false);

                var a = createArray(chkCount);
                var r = getRandomArrayElements(a, numberOfChecked);

                //console.log(r);

                checkRandom(r, chks);
            });

        });
    </script>

</head>
<body>        

    <div id="chkContainer"></div>
    <div>
        <input type="button" id="btn" value="click" />
    </div>

</body>