您好我正在尝试在页面加载时隐藏div,并在选中/取消选中复选框时显示/隐藏它。这是我的代码:
<asp:CheckBox ID="cb1" runat="server" Text="CB" />
<div runat="server" id="div1" style="display:none">
</div>
这是javascript:
window.onload = function () {
$('#cb1').change(function () {
display('div1');
})
}
function display(id) {
var traget = document.getElementById(id);
if (traget.style.display == "none") {
traget.style.display = "block";
} else {
traget.style.display = "none";
}
}
我得到的错误是:
Uncaught TypeError: Cannot read property 'style' of null
这是我的代码的最后一个版本。我已经尝试了类似的东西:
document.getElementById('div1').style.display="block";
$('#div1').hide();
......以及许多其他选择。
结果是一样的。请帮忙
答案 0 :(得分:4)
您正在使用runat="server"
,请尝试使用此
<%= div1.ClientID %>
获取div的ID,然后你可以像这样称呼你的功能
display('<%= div1.ClientID %>');
或在标记中使用clientidmode="static"
<div runat="server" id="div1" style="display:none" clientidmode="static">
</div>
答案 1 :(得分:1)
function display(id) {
if ($('#'+id).css('display') === 'none') {
$('#'+id).show();
} else {
$('#'+id).hide();
}
}
答案 2 :(得分:1)
试试这个
window.onload = function () {
$('#<%= cb1.ClientID %>').change(function () {
display('<%= div1.ClientID %>');
})
}
function display(id) {
$('#'+id).toggle();
}