如何打開表裏面

<html class="no-js" lang="en"> 
<head> 
    <script> 
    function toggle() { 
     if(document.getElementById("hidethis").style.display=='none'){ 
     document.getElementById("hidethis").style.display = ''; 
     }else{ 
     document.getElementById("hidethis").style.display = 'none'; 
     } 
    } 
    </script> 
    <script type="text/javascript"> 
     function insertTable() 
     { 
      debugger; 
      if (document.getElementById("hidethis").style.display == 'none') { 
       document.getElementById("hidethis").style.display = ''; 
       alert("yes"); 
       //var num_rows = document.getElementById('rows').value; 
       //var num_cols = document.getElementById('cols').value; 
       //var width = document.getElementById('width').value; 
       var num_rows = 2; 
       var num_cols = 2; 
       var width = 10; 
       var theader = "<table id='table1' width = ' " + width + "% '>"; 
       var tbody = ""; 

       for (var j = 0; j < num_cols; j++) { 
        theader += "<th>header col " + (j + 1) + " </th>"; 
       } 

       for (var i = 0; i < num_rows; i++) { 
        tbody += "<tr>"; 
        for (var j = 0; j < num_cols; j++) { 
         tbody += "<td>"; 
         tbody += "?"; 
         tbody += "</td>" 
        } 
        tbody += "</tr><br />"; 
       } 
       var tfooter = "</table>"; 
       document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
      } 
      else { 
       document.getElementById("hidethis").style.display = 'none'; 
      } 
     } 
    </script> 
    <style> 
     #table1 { 
      border: solid 1px; 
      border-collapse: collapse; 
     } 

      #table1 th { 
       border: solid 1px; 
       border-collapse: collapse; 
      } 

      #table1 td { 
       border: solid 1px; 
       vertical-align: middle; 
      } 
    </style> 
</head> 
<body>. 
    <div> 
     <table id="tableID" border="1" height="50" width="100"> 
      <tr onclick="insertTable();"> 
       <td>A</td> 
       <td>B</td> 
       <td>C</td> 
       <td>D</td> 
      </tr> 

      <tr> 
       <td> 
        <table> 
         <tr id="hidethis"> 
          <td id="wrapper"></td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
      <!--<tr> 
       <td> 
        <table id="table" border="1" height="50" width="100"> 
         <tr id="hidethis"> 
          <td>I</td> 
          <td>J</td> 
          <td>K</td> 
          <td>L</td> 
         </tr> 
        </table> 
       </td> 
      </tr>--> 
      <tr onclick="insertTable();"> 
       <td>E</td> 
       <td>F</td> 
       <td>G</td> 
       <td>H</td> 
      </tr> 
     </table> 
     <!--<div id="wrapper"></div>--> 
    </div> 
</body> 
</html> 
    <html class="no-js" lang="en"> 
    <head> 
     <script> 
     function toggle() { 
      if(document.getElementById("hidethis").style.display=='none'){ 
      document.getElementById("hidethis").style.display = ''; 
      }else{ 
      document.getElementById("hidethis").style.display = 'none'; 
      } 
     } 
     </script> 
     <script type="text/javascript"> 
      function insertTable() 
      { 
       debugger; 
       if (document.getElementById("hidethis").style.display == 'none') { 
        document.getElementById("hidethis").style.display = ''; 
        alert("yes"); 
        //var num_rows = document.getElementById('rows').value; 
        //var num_cols = document.getElementById('cols').value; 
        //var width = document.getElementById('width').value; 
        var num_rows = 2; 
        var num_cols = 2; 
        var width = 10; 
        var theader = "<table id='table1' width = ' " + width + "% '>"; 
        var tbody = ""; 

        for (var j = 0; j < num_cols; j++) { 
         theader += "<th>header col " + (j + 1) + " </th>"; 
        } 

        for (var i = 0; i < num_rows; i++) { 
         tbody += "<tr>"; 
         for (var j = 0; j < num_cols; j++) { 
          tbody += "<td>"; 
          tbody += "?"; 
          tbody += "</td>" 
         } 
         tbody += "</tr><br />"; 
        } 
        var tfooter = "</table>"; 
        document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
       } 
       else { 
        document.getElementById("hidethis").style.display = 'none'; 
       } 
      } 
     </script> 
     <style> 
      #table1 { 
       border: solid 1px; 
       border-collapse: collapse; 
      } 

       #table1 th { 
        border: solid 1px; 
        border-collapse: collapse; 
       } 

       #table1 td { 
        border: solid 1px; 
        vertical-align: middle; 
       } 
     </style> 
    </head> 
    <body>. 
     <div> 
      <table id="tableID" border="1" height="50" width="100"> 
       <tr onclick="insertTable();"> 
        <td>A</td> 
        <td>B</td> 
        <td>C</td> 
        <td>D</td> 
       </tr> 

       <tr> 
        <td> 
         <table> 
          <tr id="hidethis"> 
           <td id="wrapper"></td> 
          </tr> 
         </table> 
        </td> 
       </tr> 
       <!--<tr> 
        <td> 
         <table id="table" border="1" height="50" width="100"> 
          <tr id="hidethis"> 
           <td>I</td> 
           <td>J</td> 
           <td>K</td> 
           <td>L</td> 
          </tr> 
         </table> 
        </td> 
       </tr>--> 
       <tr onclick="insertTable();"> 
        <td>E</td> 
        <td>F</td> 
        <td>G</td> 
        <td>H</td> 
       </tr> 
      </table> 
      <!--<div id="wrapper"></div>--> 
     </div> 
    </body> 
    </html>

我創建這種類型的表的表，但我的要求是，如果我將先點擊大廳排再打開exctly第一行下面的表格，如果我將單擊第二行，然後打開第二排下方的同一張桌子。如何打開表裏面

來源

2015-07-03 user2863994

退房..在你的代碼

<html class="no-js" lang="en"> 
    <head> 
     <script> 
     function toggle() { 
      if(document.getElementById("hidethis").style.display=='none'){ 
      document.getElementById("hidethis").style.display = ''; 
      }else{ 
      document.getElementById("hidethis").style.display = 'none'; 
      } 
     } 
     </script> 
     <script type="text/javascript"> 
      function insertTable_1() 
      { 
      var 
      console.log(tempp) 
       debugger; 

        if (document.getElementById("hidethis").style.display == 'none') { 
         document.getElementById("hidethis").style.display = ''; 

         //var num_rows = document.getElementById('rows').value; 
         //var num_cols = document.getElementById('cols').value; 
         //var width = document.getElementById('width').value; 
         var num_rows = 2; 
         var num_cols = 2; 
         var width = 10; 
         var theader = "<table id='table1' width = ' " + width + "% '>"; 
         var tbody = ""; 
         for (var j = 0; j < num_cols; j++) { 
          theader += "<th>header col " + (j + 1) + " </th>"; 
         } 
         for (var i = 0; i < num_rows; i++) { 
          tbody += "<tr>"; 
          for (var j = 0; j < num_cols; j++) { 
           tbody += "<td>"; 
           tbody += "?"; 
           tbody += "</td>" 
          } 
          tbody += "</tr><br />"; 
         } 
         var tfooter = "</table>"; 
         document.getElementById('wrapper').innerHTML = theader + tbody + tfooter; 
         document.getElementById("hidethis_2").style.display = 'none'; 

        } 
        else { 
         document.getElementById("hidethis").style.display = 'none'; 
         document.getElementById("hidethis_2").style.display = 'none'; 

        } 
       } 
       function insertTable_2() 
      { 
        if (document.getElementById("hidethis_2").style.display == 'none') { 
         document.getElementById("hidethis_2").style.display = ''; 

         //var num_rows = document.getElementById('rows').value; 
         //var num_cols = document.getElementById('cols').value; 
         //var width = document.getElementById('width').value; 
         var num_rows = 2; 
         var num_cols = 2; 
         var width = 10; 
         var theader = "<table id='table1' width = ' " + width + "% '>"; 
         var tbody = ""; 
         for (var j = 0; j < num_cols; j++) { 
          theader += "<th>header col " + (j + 1) + " </th>"; 
         } 
         for (var i = 0; i < num_rows; i++) { 
          tbody += "<tr>"; 
          for (var j = 0; j < num_cols; j++) { 
           tbody += "<td>"; 
           tbody += "?"; 
           tbody += "</td>" 
          } 
          tbody += "</tr><br />"; 
         } 
         var tfooter = "</table>"; 
          document.getElementById('wrapper_second').innerHTML = theader + tbody + tfooter; 
          document.getElementById("hidethis").style.display = 'none'; 

        } 
        else { 
         document.getElementById("hidethis_2").style.display = 'none'; 
         document.getElementById("hidethis").style.display = 'none'; 

        } 
       } 

     </script> 
     <style> 
      #table1 { 
       border: solid 1px; 
       border-collapse: collapse; 
      } 

       #table1 th { 
        border: solid 1px; 
        border-collapse: collapse; 
       } 

       #table1 td { 
        border: solid 1px; 
        vertical-align: middle; 
       } 
     </style> 
    </head> 
    <body>. 
     <div> 
      <table id="tableID" border="1" height="50" width="100"> 
       <tr onclick="insertTable_1();"> 
        <td>A</td> 
        <td>B</td> 
        <td>C</td> 
        <td>D</td> 
       </tr> 

       <tr> 
        <td> 
         <table> 
          <tr id="hidethis"> 
           <td id="wrapper"></td> 
          </tr> 
         </table> 
        </td> 
       </tr> 
       <!--<tr> 
        <td> 
         <table id="table" border="1" height="50" width="100"> 
          <tr id="hidethis"> 
           <td>I</td> 
           <td>J</td> 
           <td>K</td> 
           <td>L</td> 
          </tr> 
         </table> 
        </td> 
       </tr>--> 
       <tr onclick="insertTable_2();"> 
        <td>E</td> 
        <td>F</td> 
        <td>G</td> 
        <td>H</td> 
       </tr> 
       <tr> 
        <td> 
         <table> 
          <tr id="hidethis_2"> 
           <td id="wrapper_second"></td> 
          </tr> 
         </table> 
        </td> 
       </tr> 
      </table> 
      <!--<div id="wrapper"></div>--> 
     </div> 
    </body> 
    </html>

來源

2015-07-03 09:21:41

應用只是幾個邏輯的，如果我有使用多行和開單表的每一行下面不是如何做呢？只使用一個在所有行上打開的子表 – user2863994

在這種情況下，不要使用不同的'onclick =「insertTable_2（）」'函數，而是在同一個函數中傳遞參數。例如對於行1-- insertTable（'1'）'，對於行-2，'insertTable（'2'）'，對於行3 -insertTable（'3'）'....像這樣，並在腳本中使用開關的情況下，或者如果像這樣if（para =='1'）{//執行第一行}的條件。如果它工作喜歡upvote並接受這個答案。 –

如何打開表裏面

回答

相關問題