javascript hidden div made visible - 無法找到元素

我加載了一個隱藏div的頁面。單擊其中一個「li」時，隱藏div的內容將被加載到另一個名爲「resultblock」的div中。我在名爲「CUSTOM」的「resultblock」div中有一個單選按鈕。點擊這個單選按鈕後，我想讓它旁邊的2個文本框從「只讀」更改爲可編輯&，然後在文本框內顯示「yyyy/mm/dd」的日期格式。通過調用一個函數eb_tb &。Upn點擊除「CUSTOM」以外的任何其他單選按鈕，我希望文本框清除&只讀，我正在嘗試使用dib_tb函數。這兩種方法似乎都不幸運行。javascript hidden div made visible - 無法找到元素

無負載的隱藏的div到「resultblock」分區，功能性的作品。這是物品進入resultblock這是造成問題的加載。

「thisFile.php」是指文件名是當前的代碼所在英寸我指的是同一個文件加載隱藏在「resultblock」div中的div。

這是我的代碼。有人能幫我發現我的錯誤嗎？

<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>

喇嘛喇嘛

來源

2015-09-09 User12345

我懷疑你的問題是你在頁面上創建重複的ID。即使原始div是隱藏的，ID仍然存在，並且可以通過getElementById找到。 –

Hello jack - 非常感謝。我確實在某個階段思考過這個問題，但說實話，不知道情況是否如此。你能幫我解決這個問題嗎？就像打印所有getElementById ID一樣，包括可見和不可見元素的console.log類型的東西？另一種我能想到的方式是，我如何動態創建這些文本框或任何元素並在其上定義一個偵聽器（如onChange，onClick等）？ – User12345

這裏有不同的方法，我設法制定出這一點。

SOLUTION - 1

http://forums.asp.net/t/1600445.aspx?To+Hide+multiple+items+having+same+ID+using+Javascript

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"; 
    } 
}

SOLUTION - 2

Hiding elements with a specified id

UPDATE：

好吧，如果你需要隱藏一組的div我通常會添加在所有這些一類像.element到隱藏：

<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(); 
});

希望這有助於其他人在同樣的情況，因爲我是英寸

來源

2015-09-09 03:11:46 User12345

javascript hidden div made visible - 無法找到元素

回答

相關問題