我有复选框列表,如果选择了子项,则自动选择父项,然后所有选项都显示在textarea中。
问题:
如果只选择了一个子项,则不会在textarea中显示Parent。选择多于1个孩子时显示。即使只选择了一个孩子,我也需要在textarea上显示父母
HTML:
<ul class="taglist">
<li class="category">Category:
<ul>
<li class="category"><input type="checkbox" name="A" value="Parent">Parent
<ul>
<li><input type="checkbox" class="liChild" name="A" value="Child1">Child1</li>
<li><input type="checkbox" class="liChild" name="A" value="Child2">Child2</li>
</ul>
</li>
</ul>
</ul>
<br/>
You checked:
<br/>
<textarea rows="4" cols="50" class="textfield" name="describe" class="required" id="describe">
</textarea>
Jquery的:
//* Parent select if children selected*//
$(document).ready(function() {
$('input.liChild').change(function() {
$(this).closest('ul')
.siblings('input:checkbox')
.prop('checked', $(this).closest('ul')
.children()
.children('input:checkbox')
.is(':checked'))
.first().change();
});
$('li.category').addClass('plusimageapply');
$('li.category').children().addClass('selectedimage');
$('li.category').children().hide();
$('li.category').each(
function(column) {
$(this).click(function(event){
if (this == event.target) {
if($(this).is('.plusimageapply')) {
$(this).children().show();
$(this).removeClass('plusimageapply');
$(this).addClass('minusimageapply');
}
else
{
$(this).children().hide();
$(this).removeClass('minusimageapply');
$(this).addClass('plusimageapply');
}
}
});
}
);
});
//*Text area update*//
function updateTextArea() {
var allVals = [];
$('.taglist :checked').each(function(i) {
allVals.push((i!=0?"\r\n":"")+ $(this).val());
});
$('#describe').val(allVals).attr('rows',allVals.length) ;
}
$(function() {
$('.taglist input').click(updateTextArea);
updateTextArea();
});
答案 0 :(得分:0)
改变这个:
$('input.liChild').change(function() {
到
$('input.liChild').click(function() {
这对我的小提琴起了作用