jquery實現多選框全選全不選功能



// 多選框全選全不選功能
function checkAllOrNone(sonCheckName, allCheckName,outEl) {
    var readyCheckNum;//已選擇的
    //點擊子選框
    $(outEl).on("click",sonCheckName,function () {
        var checkedNum = $(sonCheckName).length;
        readyCheckNum = $(sonCheckName + ":checked").length;
        if (readyCheckNum == checkedNum) {
            $(allCheckName).prop("checked", true);
        } else {
            $(allCheckName).prop("checked", false);
        };
    });
    //點擊全選框
    $(outEl).on("click",allCheckName,function () {
        if ($(this).is(":checked")) {
            $(allCheckName).prop("checked", true);
            $(sonCheckName).prop("checked", true);
        } else {
            $(allCheckName).prop("checked", false);
            $(sonCheckName).prop("checked", false);
        }
    });
};
                //子選框 //全選框  //外層父元素
checkAllOrNone(".ckson", ".ckall","#tiMuInfor");


//獲得選中的value值
$("xx").click(function () {
    var cList=[];
    $(sonCheckName+":checked").each(
        function (i) {
            cList[i]=$(this).val();
        }
    );
    console.log(cList);
});



推薦給大家我的個人網址導航:前端網址導航,希望對大家前端學習有所幫助,提高工作效率和學習效率。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章