如何获得与复选框相关的标签值(我是否打破了jsfiddle)？

Question

我需要构建一个用户选择的csv dept数字.

我从这个HTML开始:

<button id="btnDept">select Depts</button>
<div id="dialog" title="Select the Depts you want to include in the report" style="display:none;">
    <div>
        <label for="ckbx2">2</label>
        <input type="checkbox" id="ckbx2" />
        <label for="ckbx3" id="lbl3">3</label>
        <input type="checkbox" id="ckbx3" />
    </div>
</div>

...而这个jQuery:

var deptsSelected = '';
$("#btnDept").click(function () {
    $("#dialog").dialog({
        modal: true
    });
    $('checkbox').click(function() {
        deptsSelected += this.val + ',';
        alert(deptsSelected);
    });
});

...这对于显示选择的depts没有任何作用 - 这是有道理的,因为"this"可能是复选框,当然也不是标签.我将在这个对话框中有几十个复选框,并且不想写这样的东西:

$('#ckbx3').click(function(){deptsSelected + = $('lbl3').val +','; alert(deptsSelected);});

...对于每个复选框/标签对(即使使用这种强力方法,上面的代码显示了此警报,而不是我期望/希望的:

天堂到Murgatroid /什么是kerfluffle？!？

jsfiddle在这里:http://jsfiddle.net/clayshannon/aWpPN/

Answer 1

请试试这个:

var deptsSelected = '';
$("#btnDept").click(function () {
    $("#dialog").dialog({
        modal: true
    });
    $("input:checkbox").click(function () {
        deptsSelected += $("label[for='" + this.id + "']").text() + ',';
        alert(deptsSelected);
    });
});

以下是它的小提琴:http://jsfiddle.net/yFB6W/