當按下提交按鈕時顯示錶格

我在我的頁面上有一個表格，我想知道是否可以隱藏表格並在單擊按鈕時顯示？我的表：當按下提交按鈕時顯示錶格

<table border="5",th,td, cellspacing="5", cellpadding="5", width="500", align="center"> 
      <tr> 
       <th>TP ID</th> 
       <th>Permit Deny</th> 
       <th>Level</th> 
       <th>Session</th> 
       <th>Information Specialist</th> 
      </tr> 

      <?php foreach ($results as $row): ?> 

      <tr> 
       <td><?php echo $row->TP_ID ?></td> 
       <td><?php echo $row->Permit_or_Deny ?></td> 
       <td><?php echo $row->Level ?></td> 
       <td><?php echo $row->Session ?></td> 
       <td><?php echo $row->Information_specialist ?></td> 
       </tr> 
      <?php endforeach ?> 

     </table>

來源

2014-03-18 user3403327

是通過使用JavaScript或jQuery – Chitowns24

你可以做到這一點有兩種方式，第一種是使用PHP：

<?php 
$action = $_GET['action']; 
if ($action == "table") { 
echo "Your table goes here"; //The table you want to display 
} 
else 
{ 
echo '<html><form action="?action=table"><input type="submit" value="Submit"></form>'; //The submit button 
} 
?>

，第二種方法是使用JavaScript的使用jQuery：

HTML：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script> 
<button href="#collapse" class="nav-toggle">Show</button> 
<div id="collapse" style="display:none"> 
    <p>Your Table Goes Here</p> 
</div>

JS：

$(document).ready(function() { 
    $('.nav-toggle').click(function() { 
     var collapse_content_selector = $(this).attr('href'); 
     var toggle_switch = $(this); 
     $(collapse_content_selector).toggle(function() { 
      if ($(this).css('display') == 'none') { 
       toggle_switch.html('Show'); 
      } else { 
       toggle_switch.html('Hide'); 
      } 
     }); 
    }); 

});

的jsfiddle：http://jsfiddle.net/Starfire1337/33ygT/

來源

2014-03-18 19:14:25 Starfire1337

使用jQuery你可以做這樣的事情：http://jsfiddle.net/vVsAn/2113/

的Jquery：

$('#showHide').live('click', function(event) {   
     $('#hideShowDiv').toggle('hide'); 
    });

HTML：

<div id='hideShowDiv'> 
    Put your table inside a div <br /> 
</div> 
<input type='button' id='showHide' value='hide/show'>

來源

2014-03-18 19:14:47

謝謝！但我把桌子從默認隱藏，然後顯示？ – user3403327

然後你需要做的就是將div的樣式設置爲'display：none;'，然後而不是'.toggle（'hide'）;''你會擁有'.toggle（'show'）;'' –

當按下提交按鈕時顯示錶格

回答

相關問題