html结构如下:
<div id="demo">
<div class="checkbox">
<label>a:</label>
<input type="radio" value="1" name="a" />1
<input type="radio" value="2" name="a" />2
</div>
<div class="checkbox">
<label>b:</label>
<input type="radio" value="1" name="b" />1
<input type="radio" value="2" name="b" />2
</div>
<div class="checkbox">
<label>c:</label>
<input type="radio" value="1" name="c" />1
<input type="radio" value="2" name="c" />2
</div>
<div class="checkbox">
<label>d:</label>
<input type="radio" value="1" name="d" />1
<input type="radio" value="2" name="d" />2
</div>
</div>
<input type="button" value="btn" />
要求是点击btn,判断哪个类别没有选择,输出它的label
比如这个就输出"a没有选择"
用jq怎么实现
<div id="demo">
<div class="checkbox">
<label>a:</label>
<input type="radio" value="1" name="a" />1
<input type="radio" value="2" name="a" />2
</div>
<div class="checkbox">
<label>b:</label>
<input type="radio" value="1" name="b" />1
<input type="radio" value="2" name="b" />2
</div>
<div class="checkbox">
<label>c:</label>
<input type="radio" value="1" name="c" />1
<input type="radio" value="2" name="c" />2
</div>
<div class="checkbox">
<label>d:</label>
<input type="radio" value="1" name="d" />1
<input type="radio" value="2" name="d" />2
</div>
</div>
<input type="button" id="btn" value="btn" />
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$('#btn').click(function(){
var result = [];
$('#demo div.checkbox').each(function(index){
if($('input:checked', this).length === 0){
result.push($('label:first', this).text() + '\t第' + (index + 1) + '个没有选择');
//如果只需要找到一个就不再往后找了的话,把下面这行的注释删除掉
//return false;
}
});
alert(result.join('\n'));
});
</script>