如何从父和子复选框中检索值复选框

时间:2013-03-22 04:32:09

标签: jquery checkbox

我遇到这个问题我有检查父母和孩子的代码。但问题是我不知道如何在最后检索价值..这里包括父母和子女的复选框列表

<ul id="jobCat">
        <li>
            <input id="s9" class="parent" type="checkbox" name="jobCat" value="Accounting / Finance"
            />Accounting / Finance</li>
        <li>
            <input id="s15" class="parent-s9" type="checkbox" name="jobCat" value="Banking / Financial"
            /><span>Banking / Financial</span>
        </li>
        <li>
            <input id="s16" class="parent-s9" type="checkbox" name="jobCat" value="General / Cost Acct"
            /><span>General / Cost Acct</span>
        </li> </ul>

这里是jquery

 var checkboxHandlerObj = {

    init: function () {
        $('#jobCat input:checkbox[class="parent"]').click(checkboxHandlerObj.parentClicked);
        $('#jobCat input:checkbox[class^="parent-"]').click(checkboxHandlerObj.childClicked);
    },
    parentClicked: function () {
        var parentCheck = this.checked;
        $('#jobCat input:checkbox[class="parent-' + $(this).attr('id') + '"]').each(function () {
            this.checked = parentCheck;
        });
    },
    childClicked: function () {
        var temp = $(this).attr('class').split('-');
        var parentId = temp[1];
        $('#' + parentId)[0].checked = $('#jobCat input:checkbox[class="' + $(this).attr('class') + '"]:checked').length !== 0;
    }
};

checkboxHandlerObj.init();

这里..点击会计/财务复选框后,它全部选中。但这并没有显示最终的价值所以我想要的是我想最终显示所有这些(父母和孩子)。我很困惑如何编码...请帮助我任何人..

1 个答案:

答案 0 :(得分:0)

请看一下小提琴。这可能会让你知道如何做到这一点..

http://jsfiddle.net/Gy9Jq/

您需要更改以下功能:

 parentClicked: function () {
        var parentCheck = this.checked;
        var values='i';
        $('#jobCat input:checkbox[class="parent-' + $(this).attr('id') + '"]').each(function () {
            this.checked = parentCheck;
            values+=this.attr('value');
        });
        alert('hi');
    },

检查更新的小提琴。我认为这是你想要的:

http://jsfiddle.net/Gy9Jq/6/