如何使用jquery實例在超鏈接中創建頁面？

Question

頁面的內容應該同一網頁上使用ID div標籤的屬性顯示。標籤不應該重定向到下一頁。內容應該切換。

Answer 1

請檢查初級講座例如：

$(document).ready(function() { 
     $("#tablecontent").show(); 
     $("#tablecontent1").hide(); 
     $(".dropdown-menu li a").click(function(e) { 
      e.preventDefault(); 
      var href = $(this).attr('href'); 
      if(href=="#tablecontent"){ 
       $("#tablecontent").show(); 
       $("#tablecontent1").hide(); 
       //alert(href); 
      }else{ 
       $("#tablecontent1").show(); 
       $("#tablecontent").hide(); 
       //alert(href); 
      }   
     }); 
    }); 
<div class="table-responsive" id="tablecontent">   

       <table class="table"> 
       <thead> 
        <tr> 
        <th>Table</th> 
        <th>Field Name</th> 
        <th>Data Type</th> 
        <th>Size</th> 
        <th>Key</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
        <td>Person</td> 
        <td> 
         <ul> 
          <li>person_id</li> 
          <li>person_first</li> 
          <li>person_name</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>int</li> 
          <li>varchar</li> 
          <li>varchar</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>int</li> 
          <li>varchar</li> 
          <li>varchar</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>PRI</li> 
         </ul> 
        </td> 
        </tr> 
       </tbody> 
       </table> 
       </div> 
       <div class="table-responsive" id="tablecontent1">   
       <table class="table"> 
       <thead> 
        <tr> 
        <th>Table</th> 
        <th>Field Name</th> 
        <th>Data Type</th> 
        <th>Size</th> 
        <th>Key</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
        <td>car</td> 
        <td> 
         <ul> 
          <li>car_id</li> 
          <li>car_model</li> 
          <li>car_price</li> 
          <li>person_id</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>int</li> 
          <li>varchar</li> 
          <li>varchar</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>int</li> 
          <li>varchar</li> 
          <li>varchar</li> 
         </ul> 
        </td> 
        <td> 
         <ul> 
          <li>PRI</li> 
          <li>-</li> 
          <li>-</li> 
          <li>FK</li> 
         </ul> 
        </td> 
        </tr> 
       </tbody> 
       </table> 
       </div>