使javascript隐藏div可见-can'；找不到元素
我加载一个有隐藏div的页面。单击其中一个“li”后，隐藏div的内容将加载到另一个名为“resultblock”的div中。我在“resultblock”div中有一个名为“CUSTOM”的单选按钮。单击此单选按钮后，我希望旁边的两个文本框从“只读”更改为“可编辑”，然后在文本框内显示“yyy/mm/dd”的日期格式。我试图通过调用函数eb_tb和.Upn来实现这一点，单击“自定义”以外的任何其他单选按钮“，我希望文本框能够清除并转为只读，我正试图用dib_tb函数来实现这一点。不幸的是，这两种方法似乎都不起作用 如果不将隐藏的div加载到“resultblock”div中，该功能就可以工作。导致问题的是将项目加载到resultblock中 “thisFile.php”是指当前代码所在的文件名。我引用同一个文件来加载隐藏在“resultblock”div中的div 这是我的密码。有人能帮我找出我的错误吗使javascript隐藏div可见-can'；找不到元素,javascript,jquery,html,Javascript,Jquery,Html,我加载一个有隐藏div的页面。单击其中一个“li”后，隐藏div的内容将加载到另一个名为“resultblock”的div中。我在“resultblock”div中有一个名为“CUSTOM”的单选按钮。单击此单选按钮后，我希望旁边的两个文本框从“只读”更改为“可编辑”，然后在文本框内显示“yyy/mm/dd”的日期格式。我试图通过调用函数eb_tb和.Upn来实现这一点，单击“自定义”以外的任何其他单选按钮“，我希望文本框能够清除并转为只读，我正试图用dib_tb函数来实现这一点。不幸的是，这两
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--link rel="stylesheet" href="css/revised.css"-->
<link rel="stylesheet" type="text/css" href="css/dashboard.css">
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
function setDivProps() {
$('#resultblock').height(594).css({
cursor: "auto",
backgroundColor: "#A69A74",
// backgroundColor: "#FFFFFF",
marginLeft: "5%",
marginTop: "5%",
width: "88%",
height: "75%",
borderRadius: "25px",
border: "2px solid black",
// background: "url(image/divpic.jpg)"
});
};
function radio_check_enable_custom_date_range_text_box() {
if (document.getElementById('hd_radio_1').checked) {
document.getElementById('custom_date_range_id_1').removeAttribute('readonly');
document.getElementById('custom_date_range_id_2').removeAttribute('readonly');
document.getElementById('custom_date_range_id_1').value = 'yyyy-mm-dd';
document.getElementById('custom_date_range_id_2').value = 'yyyy-mm-dd';
}
}
;
function radio_check_disable_custom_date_range_text_box() {
document.getElementById('hd_radio_1').checked == false;
if (document.getElementById('hd_radio_1').checked === false) {
document.getElementById('custom_date_range_id_1').value = '';
document.getElementById('custom_date_range_id_2').value = '';
document.getElementById('custom_date_range_id_1').setAttribute('readonly', true);
document.getElementById('custom_date_range_id_2').setAttribute('readonly', true);
}
}
;
$(document).ready(function(){
$('#cssmenu li').click(function(){
$("#cssmenu li").removeClass("active");
$(this).addClass("active");
});
$("#page1").click(function(){
setDivProps();
// $(this).css("background-color","black");
$('#resultblock').load('thisFile.php #form_1');
});
$("#page2").click(function(){
setDivProps();
$('#resultblock').load('thisFile.php #form_2');
});
$("#page3").click(function(){
setDivProps();
$('#resultblock').load('thisFile.php #form_3');
});
});
</script>
<title>DEMO</title>
</head>
<body>
<div>
<header class="site-header-wrap">
<div class="site-header">
<h1>MY DEMO</h1>
</div>
</header>
<div id='cssmenu'>
<ul class="uinav">
<li class='active'><a id="home1" href='#' ><span>OPTION-1</span></a></li>
<li><a id="page1" href="#"><span>OPTION-2</span></a></li>
<li><a id="page2" href="#"><span>TOPTION-3</span></a></li>
<li><a id="page3" href="#"><span>OPTION-4</span></a></li>
</ul>
</div>
<div id="div_id_1" style="display: none;">
<form method="post" action="" id='form_1'>
<table id="tbl_format_1">
<tr bgcolor="#8F4A11">
<td colspan="3" id="table_f_1">
<b> TIMELINE </b>
</td>
</tr>
<tr>
<td colspan=3>
函数setDivProps（）{
$（'#resultblock'）.height（594）.css({
光标：“自动”，
背景颜色：“A69A74”，
//背景颜色：“FFFFFF”，
保证金左列：“5%”，
马金托普：“5%”，
宽度：“88%”，
身高：“75%”，
边界半径：“25px”，
边框：“2件纯黑”，
//背景：“url（image/divpic.jpg）”
});
};
功能收音机检查启用自定义日期范围文本框（）{
if（document.getElementById（'hd_radio_1'）。选中）{
document.getElementById（'custom_date_range_id_1'）。removeAttribute（'readonly'）；
document.getElementById（'custom_date_range_id_2'）。removeAttribute（'readonly'）；
document.getElementById（'custom_date_range_id_1'）。值='yyyy-mm-dd'；
document.getElementById（'custom_date_range_id_2'）。值='yyyy-mm-dd'；
}
}
;
功能收音机检查禁用自定义日期范围文本框（）{
document.getElementById（'hd_radio_1'）。选中==false；
if（document.getElementById（'hd_radio_1'）。选中===false）{
document.getElementById（'custom_date_range_id_1'）。值=''；
document.getElementById（'custom_date_range_id_2'）。值=''；
document.getElementById（'custom_date_range_id_1'）.setAttribute（'readonly'，true）；
document.getElementById（'custom_date_range_id_2'）.setAttribute（'readonly'，true）；
}
}
;
$（文档）.ready（函数（）{
$（'#cssmenu li'）。单击（函数（）{
$（“#cssmenu li”）.removeClass（“活动”）；
$（此）.addClass（“活动”）；
});
$（“#第1页”）。单击（函数（）{
setDivProps（）；
//$（this.css（“背景色”、“黑色”）；
$（'resultblock'）.load（'thisFile.php#form_1'）；
});
$（“#第2页”）。单击（函数（）{
setDivProps（）；
$（'#resultblock'）.load（'thisFile.php#form_2'）；
});
$（“#第3页”）。单击（函数（）{
setDivProps（）；
$（'resultblock'）.load（'thisFile.php#form_3'）；
});
});
演示
我的演示
时间线
以下是我解决这个问题的不同方法 解决方案-1
函数隐藏（ctrlId）
{
var Ctrls=文件所有（ctrlId）；
对于（var i=0；我怀疑您的问题在于您在页面上创建了重复的ID。尽管原始div已隐藏，但ID仍然存在，并且将通过getElementById
找到。你好，杰克-非常感谢。我确实在某个阶段考虑过，但老实说，我无法确定是否存在这种情况。您能帮助我吗用一种策略来解决这个问题？比如用console.log之类的东西打印所有getElementById，包括可见和不可见元素的ID？我能想到的另一种方法是，如何动态创建这些文本框或任何元素并在其上定义侦听器（如onChange、onClick等）？
function hideAll(ctrlId)
{
var Ctrls = document.all(ctrlId);
for (var i = 0; i<Ctrls.items.length; i++)
{
var Ctrl = Ctrls.items(i);
Ctrl.style.display = "none";
}
}
<div id="asd" class="element-to-hide">...
<div id="lol" class="element-to-hide">...
<div id="foo" class="element-to-hide">...
Ant after just a touch of jQuery:
$('.element-to-hide').each(function(){
$(this).hide();
});