我查看了问题和答案,我几乎就在那里。只需要一点帮助即可完成。
如果用户选中一个复选框并将textarea留空inser消息。如果选中复选框并且textare不为空,请显示答案。
我只希望在选中复选框时在每一行上运行操作。目前它会影响所有行。谢谢你的帮助
表
<table id="activity">
<thead>
<tr>
<th scope="col">1</th>
<th scope="col">2</th>
<th scope="col">3</th>
<th scope="col">4</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" class="answer" /></td>
<td>concrete</td>
<td><textarea id="response1" name="response1" title="response1" rows="3" class="form-control"></textarea></td>
<td class="answer_block"><span>Answer 1</span></td>
</tr>
<tr>
<td><input type="checkbox" class="answer" /></td>
<td>concrete</td>
<td><textarea id="response2" name="response2" title="response2" rows="3" class="form-control"></textarea></td>
<td class="answer_block"><span>Answer 2</span></td>
</tr>
<tr>
<td><input type="checkbox" class="answer" /></td>
<td>concrete</td>
<td><textarea id="response3" name="response3" title="response3" rows="3" class="form-control"></textarea></td>
<td class="answer_block"><span>Answer 3</span></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3"><button type="submit" name="check" id="button-check">Check</button> <button type="reset" name="reset" value="reset" id="button-reset">Reset</button></td>
</tr>
</tfoot>
</table>
脚本
$('button#button-check').on('click' , function() {
$('.answer').each(function() {
if ($(this).is(':checked') && !$.trim($(".form-control").val()).length ){
$('.form-control').val('Input can not be left blank');
$(this).parent().siblings().children('span').hide();
} else {
$(this).parent().siblings().children('span').show();
}
});
});
答案 0 :(得分:1)
可能会有所帮助
$('button#button-check').on('click' , function() {
$('.answer').each(function() {
if ($(this).is(':checked') && $(this).closest('tr').find('textarea').val() == ""){
$(this).closest('tr').find('.form-control').attr('placeholder','Input can not be left blank');
$(this).closest('tr').find('.answer_block span').hide();
} else if($(this).is(':checked')){
$(this).closest('tr').find('.answer_block span').show();
}
});
});