判斷Checkbox是否被勾選(含多個選項)及全選

當初要判斷這個的原因是因為前端使用了Razor自動產生了一排的同ID的

<input id = 'CheckAll' type = 'CheckBox' name = 'CheckAll' value = '全選'>

@foreach (var item in ItemList){

    <input id="Data" type='checkbox' name='Data' value='@item.Value'>@item.Text

}

這樣會自動產生 ItemList.Length 個 id為Data的checkbox

通常一般的做法判斷checkbox是否被勾選是使用

$('#Data').prop('checked');

假如他是true 則代表勾選,false則代表沒有勾選

並且不可以使用

$('#Data').attr('checked');

這個判斷會顯示undefined


而這時候我想要的判斷是,我想要判斷 是否有其中任何一個被選擇 ?

因此我使用下列判斷

$('input[id="Data"]:checked').length != 0


$('input[id="Data"]:checked')這個判斷是顯示所有id為Data且被Check的

而.length則是判斷是否有被選取的選項(判斷是否有被選取)


如何一次取得多個CheckBox的值

<script type="text/javascript">

        function show() {

            obj = document.getElementsByName("Data");

            check_value = [];

            for (i in obj) {

                if (obj[i].checked)

                    check_value.push(obj[i].value);

            }

            alert(check_value);

        }

    </script>

一次選取多個CheckBox


    var radioCheck = function () {

        //若選取父項 子項跟隨

        var varBox = document.getElementsByName("Data");

        varBox .forEach(varN => {

            if ($('#CheckAll').prop('Checked'))

                varN.checked = true;

            else

                varN.checked = false;

        });

    }



參考http://www.jysblog.com/coding/web/web-%E5%88%A4%E6%96%B7checkbox%E6%98%AF%E5%90%A6%E8%A2%AB%E5%8B%BE%E9%81%B8/

https://injerry.pixnet.net/blog/post/6477885

https://ithelp.ithome.com.tw/articles/10224316


留言

這個網誌中的熱門文章

無法載入檔案或組件 'System.IO.Compression' 或其相依性的其中之一。

MongoDB 入門

javascript 更改屬性及創建標籤