從標籤控件中移除焦點

Question

我在頁面上有一個帶有兩個選項卡的選項卡控件。當我點擊第二個選項卡時，頁面向下滾動到選項卡控件。我不希望對選項卡控件有任何關注，並將其保留在原來的位置。我知道這是因爲<li>上的href，但如果我刪除了href，我看不到任何數據。

我的HTML代碼如下：

<div id="tabContainer" class="Container"> 
    <ul class="maintabs"> 
    <li><a href="#tabDescription" class="active">Description</a></li> 
    <li><a href="#tabTerms">Terms</a></li> 
    </ul> 
    <div class="tabDetails"> 
    <div id="tabDescription" class="tabContents"> 
     <div id="divDescription" runat="server"></div>    
    </div> 
    <div id="tabTerms" class="tabContents"> 
     <div id="divterms" runat="server"></div> 
    </div>        
    </div> 
</div> 

的Javascript：

<script type="text/javascript"> 
     $(document).ready(function() { 
      $(".tabContents").hide(); 
      $(".tabContents:first").show(); 

      $("#tabContainer ul li a").click(function() { 

       var activeTab = $(this).attr("href"); 
       $("#tabContainer ul li a").removeClass("active"); 
       $(this).addClass("active"); 
       $(".tabContents").hide(); 
       $(activeTab).show(); 
      }); 
     }); 
</script> 

Answer 1

你需要從出現禁用鏈接的默認行爲。

對於您的點擊操作，請接受第一個參數e（用於事件）並調用JQuery的preventDefault function。這將阻止瀏覽器關注鏈接。

$("#tabContainer ul li a").click(function (e) { 
    // hey browser, don't handle this link--we'll take it from here 
    e.preventDefault(); 

    // ... 
}); 

您可以在函數的任何位置調用該函數（例如，在結尾處）。