我需要构建一个用户选择的部门编号csv。
我从这个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 +','; 警报(deptsSelected); });
...对于每个复选框/标签对(即使使用这种强力方法,上面的代码显示了这个警报,而不是我期望/希望的:
天堂到Murgatroid /什么是kerfluffle?!?
jsfiddle在这里:http://jsfiddle.net/clayshannon/aWpPN/
答案 0 :(得分:5)
请试试这个:
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/
答案 1 :(得分:2)
还有其他方法,但是这个方法会更新一个数组,其中包含已分割的数字值,而不是已选中的复选框ID
$("#btnDept").click(function () {
$("#dialog").dialog({
modal: true
});
});
function getChecked() {
var deptsSelected = [];
$('#dialog :checked').each(function() {
deptsSelected.push( this.id.split('ckbx')[1] );
});
alert( deptsSelected );
}
$('#dialog').find('input').change( getChecked );
答案 2 :(得分:1)
将this.val()
替换为$('label[for="'+$(this).attr('id')+'"]').html()
。 $('checkbox')
应为$('input[type="checkbox"])
答案 3 :(得分:1)
您可以为复选框添加值:
<input type="checkbox" id="ckbx2" value="2" />
答案 4 :(得分:1)
这就是你想要的答案:
<input type='button' id='btnDept' value='Depts' />
<div id='dialog' title='Select the Depts you want to include in the report'>
<div>
<label for='ckbx2'>2</label>
<input type='checkbox' id='ckbx2' value='2' />
<label for='ckbx3' id='lbl3'>3</label>
<input type='checkbox' id='ckbx3' value='3' />
</div>
</div>
var deptsSelected = [];
$("#btnDept").click(function(){
$("#dialog").dialog({
modal: true
});
});
$(':checkbox').click(function(){
$(':checkbox').each(function(i){
if($(this).is(':checked')){
deptsSelected[i] = $(this).val();
}
else{
deptsSelected.splice(i, 1);
}
});
alert(deptsSelected.join());
});
我在http://jsfiddle.net/PHPglue/akp7Q/1/放了一个新小提琴。您忘记了checkbox
es的值,您的jQuery也需要帮助。
答案 5 :(得分:1)
通过向标签中的复选框添加值。
function Person (name, age, newParameter){
this.name = name;
this.age = age;
this.newParameter = newParameter;
}
然后迭代容器获取这些值。 (仅检查示例)
<div class="col-lg-12" id="checkBoxContainer">
<div class="checkbox checkbox-primary checkbox-inline">
<input type="checkbox" id="checkbox1" value="value1" checked="">
<label for="checkbox1"> value1 </label>
</div>
<div class="checkbox checkbox-primary checkbox-inline">
<input type="checkbox" id="checkbox2" value="value2" checked="">
<label for="checkbox2"> value2 </label>
</div>
</div>