MUI 實現類似購物車全選、單選功能

   <div class="mui-input-group" style="float:left; z-index: 1;top: 10px;">
         <div class="mui-input-row mui-checkbox mui-left">
                <label></label>
                <input name="checkbox" class="listCheckBox" value="@item.ID" type="checkbox">
           </div>
     </div>  

   

<div id="downloadBar">
    <span></span>
    <div class="bar-item downloadbar-close">
        <div class="mui-input-row mui-checkbox mui-left">
            <label style=" padding-left: 39px;font-size:16px;">全選</label>
            <input type="checkbox" id="checkAll" style="left: 12px;top: 10px;">
        </div>
    </div>
    <div class="bar-item downloadbar-open" id="downloadbar">下單<label></label></div>
</div>

  <script type="text/javascript">
    //點擊全選按鈕
        var orderid = [];  //數組存ID
        var chkall = document.getElementById('checkAll'); 
        chkall.addEventListener('change', function (e) {
            var listBox = mui('.listCheckBox');
            //   var num = 0; //查看有多少條數據
            if (e.target.checked) {
               //全選
                listBox.each(function () {
                    this.checked = true;
                    orderid.push($(this).val());   //存入ID
                   // num++;
                })
               // console.log(num);
                var listBox = $(".listCheckBox:checked").length;
                $(".downloadbar-open label").text(listBox);
            } else {
                //取消全選
                listBox.each(function () {
                    this.checked = false;
                })
                orderid = [];  //清空所有ID
                $(".downloadbar-open label").text(0);
            }     
        })  

       //單選
        var chknum = 0;
        var cbknum = mui('.listCheckBox').length;   
        var listCheckBox = $(".listCheckBox");
        listCheckBox.each(function (i, btn) {
            btn.addEventListener("change", function () {
                if (this.checked) {
                    chknum++;
                    orderid.push($(this).val()); //存入ID
                } else {
                    chknum--;
                    orderid.remove($(this).val());//刪除指定ID
                }
                if (cbknum == chknum) {   //是否是全選判斷
                    chkall.checked = true;
                } else {
                    chkall.checked = false;
                }
                var listBox = $(".listCheckBox:checked").length;
                $(".downloadbar-open label").text(listBox);
            })
        })
        //刪除指定數組元素
        Array.prototype.remove = function (val) {
            var index = this.indexOf(val);
            if (index > -1) {
                this.splice(index, 1);
            }
        };

        //下單按鈕點擊事件
        document.getElementById("downloadbar").addEventListener("tap", function () {   
            console.log(orderid);
        })
</script>