在jQuery選項卡腳本中通過url定義選定的選項卡

Question

我有一個jQuery搜索腳本，它使用選項卡爲用戶定義他們要使用的搜索類型。當用戶搜索時，創建一個類似於＃類型的網址/查詢 /。如果＃類型位於URL中，則與該類型對應的選項卡顯示爲選中狀態。但是，如果查詢也在url中（＃類型/查詢 /）該選項卡未被選中。用我的代碼下面，我怎麼能做到這一點，所以它會忽略/ 查詢 /？後的一切。我希望你能理解我想要描述的東西。

我的jQuery腳本是：

$(document).ready(function() { 
    $('[id^=type_]').click(function() { 
     type = this.id.replace('type_', ''); 
     $('[id^=type_]').removeClass('selected'); 
     $('#type_' + type).addClass('selected'); 
     return false; 
    }); 
    if (window.location.hash != "") { 
     url = window.location.hash.replace('#', ''); 
     $('#type_' + url).click(); 
    } else { 
     $('#type_search').click(); 
    } 
    $('#query').keyup(function() { 
     var query = $(this).val(); 
     var url = '/' + type + '/' + query + '/'; 
     window.location.hash = '' + type + '/' + query + '/'; 
     document.title = $(this).val() + ' - My Search'; 
     $('#results').show(); 
     if (query == '') { 
      window.location.hash = ''; 
      document.title = 'My Search'; 
      $('#results').hide(); 
     } 
     $.ajax({ 
      type: 'GET', 
      url: url, 
      dataType: 'html', 
      success: function (results) { 
       $('#results').html(results); 
      } 
     }); 
    }); 
    var textlength = $('#query').val().length; 
    if (textlength <= 0) { 
     $('#query').focus(); 
    } else { 
     $('#query').blur(); 
    } 
}); 

Answer 1

我想出了一個略顯笨拙的方法是：

$('a').each(
    function(){ 
     var url = this.href; 
     var hashAt = url.indexOf('#'); 
     var nextSlashAt = url.indexOf('/',hashAt); 
     var url = url.substring(0,nextSlashAt); 
     var tab = url.substring(hashAt); 
     $(this).text(url + " (" + tab + ")."); 
    }); 

JS Fiddle demo。

顯然，而不是通過a元素迭代，你要到url變量分配到window.location;，但從此之後，應該很容易地適應您的需求，我想。

---

參考文獻：

• indexOf()。
• substring()。