检查Jquery多个灵活复选框检查并显示文本框

Question

我有多个灵活的复选框，这是所有复选框记录来自数据库。我想要做的是当我选中任何复选框时，它会显示复选框下方的文本框。

这是我的页面布局

屏幕截图现在显示所有文本框，默认情况下，所有文本框都必须隐藏。

这是我的代码

<?php $no = 0; if(isset($skill_records)) : foreach($skill_records as $row) : $no++; ?>

<div class="checkbox">
<label>
<input type="checkbox" value="<?php echo $row->skillid; ?>" name="skillid[]"  id="skillid<?php echo $no; ?>"  <?php echo set_checkbox('skillid[]', $row->skillid); ?>>
<?php echo $row->skill; ?>
</label>
</div>
<div class="col-md-3" style="display:none;">
<input type="text" value="" name="score[]" class="score input-sm form-control" id="score<?php echo $no; ?>" placeholder="Score"  >
</div>
<?php endforeach; ?>
<?php endif; ?>

正如您所见，我的文本框已设为display:none

任何想法如何做到这一点是Jquery？

由于

Answer 1

试

$("input[type=checkbox]").change(function () {
    $(this).closest("div").next().toggle(this.checked);
});

<强> DEMO

Answer 2

$('li').change(function(){

var target = $(this).closest('li').find('.CLASS_OF_INPUT');

if (this.checked) {
        target.show();
    }

});