我有这两个复选框:
<label for="cell">3. Do you currently have a cell phone? (Y/N)</label>
<input type="checkbox" name="cell" name="cell" id="cell" data-on="Yes" data-off="No" />
<label for="blackBerry">4.If YES, is the cell phone a BlackBerry? (Y/N)</label>
<input type="checkbox" name="blackBerry" name="blackBerry" id= "blackBerry" data-on="Yes" data-off="No" />
仅当第一个问题选择“是”时,如何才能让第二个问题显示在页面上?
提前致谢。
您可以使用 JavaScript 来完成此操作
JavaScript
var elem = document.getElementById('cell');
elem.addEventListener('click', function() {
var divElem = document.getElementById('divPhone');
if( this.checked){
divElem.style.display = 'block' ;
}
else{
divElem.style.display = 'none' ;
}
});
HTML
<label for="cell">3. Do you currently have a cell phone? (Y/N)</label>
<input type="checkbox" name="cell" name="cell"
id="cell" data-on="Yes" data-off="No" />
<div id="divPhone" class="hidden">
<label for="blackBerry">4.If YES, is the cell phone a BlackBerry?
(Y/N)</label>
<input type="checkbox" name="blackBerry" name="blackBerry"
id= "blackBerry" data-on="Yes" data-off="No" />
</div>
.hidden
{
display: none;
}
检查小提琴 http://jsfiddle.net/sushanth009/999y9/
使用 jQuery 还是更简单..
$('#cell').on('click', function() {
if(this.checked){
$('#divPhone').removeClass('hidden');
}
else{
$('#divPhone').addClass('hidden');
}
});
jQuery 小提琴 http://jsfiddle.net/sushanth009/jcHUF/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)