javascript在复选框上隐藏/显示div:选中/未选中 [英] javascript Hide/show div on checkbox: checked/unchecked
问题描述
我正在尝试在 javascript 中创建一个函数,它将在我的注册表单中隐藏/显示特定的 div,具体取决于我的复选框的状态(选中或未选中).这是我的功能:
I am trying to make a function in javascript, that will hide / show particular div in my registration form, depending on the state of my checkbox (checked or not). Here is my function:
function doruc() {
var elem = document.getElementById('powermail_fieldwrap_331');
if (document.getElementById ('powermail_field_doruovaciaadresa2_1').checked) {
elem.display='block';
} else {elem.display:none;}
}
它不起作用.我正在检查和取消选中我的复选框,但没有任何反应.还有件事儿.我希望该 div 被初始化为隐藏.我应该把这个放在我的css中吗?:
It isnt working. I am checking and unchecking my checkbox, but nothing happens. Oh and one more thing. I want that div to be initialized as hidden. Should I put in my css this? :
#powermail_fieldwrap_331{
display:none;
}
我非常感谢任何建议.
推荐答案
你可以使用
var elem = document.getElementById('powermail_fieldwrap_331');
document.getElementById('powermail_field_doruovaciaadresa2_1').onchange = function() {
elem.style.display = this.checked ? 'block' : 'none';
};
如果你想默认隐藏它,你可以使用#powermail_fieldwrap_331{display:none;}
.但如果你想确定,最好使用
If you want to hide it by default, you could use #powermail_fieldwrap_331{display:none;}
. But if you want to be sure, better use
var elem = document.getElementById('powermail_fieldwrap_331'),
checkBox = document.getElementById('powermail_field_doruovaciaadresa2_1');
checkBox.checked = false;
checkBox.onchange = function doruc() {
elem.style.display = this.checked ? 'block' : 'none';
};
checkBox.onchange();
这篇关于javascript在复选框上隐藏/显示div:选中/未选中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!