根据URL设置活动链接

如果URL结束： ?style=product我想在li的product类中添加一个active类

HTML：

 
 
Product
 
Product 2
 
Product 3
  

Answer 1

你应该和Andy一起去渲染这个服务器端，但是为了回答你的问题，你应该做些什么来实现javascript / jQuery中的相同（如果没有服务器端）

获取“样式”查询字符串肯定更简单，如果你可以对url做出很多假设（它将始终具有该查询字符串，它将始终是第一个查询字符串，将永远不会有任何其他查询字符串，在查询字符串之后永远不会有任何哈希数据…）。 如果你不能做出这样的假设，下面可能是最安全的方法。

 var activeStyle = ''; if(window.location.search != '') { // find querystring section or url var query = window.location.search.substring(1); // split querystring into key/value-pairs query = query.split('&'); for(var i = 0; i < query.length; i++) { // split key/value pair into key and value var keyvalue = query[i].split('='); // find value of ?style= if(keyvalue[0].toLowerCase() == 'style')) { activeStyle = keyvalue[1]; break; } } } if(activeStyle != '') { $('li.' + activeStyle).addClass('active'); } 

请注意，我假设您还希望product2在您的URL以style=product2结尾时变为active 。 如果您只想在选择product时应用此效果，则必须将最后一个条件调整为

 if(activeStyle.toLowerCase() == 'product') { $('li.product').addClass('active'); } 

编辑

编辑上面的选择以使用window.location.search来获取Andy的建议，该建议可以防止location.hash 。

Answer 2

首先你需要一个类似于这里发布的javascript函数，这将允许你从查询字符串中获取样式变量。

一旦你尝试了类似的东西：

 var style = getParameterByName('style'); $('li.' + style).addClass('active'); 

Answer 3

 function getStyleValue(uri) { var var, hash; var hashes = uri.slice(uri.indexOf('?') + 1).split('&'); for(var i = 0; i < hashes.length; i++) { hash = hashes[i].split('='); if(hash[0] == 'style') { return hash[2]; } } return false; } 

那么你可以使用喜欢

 var selected = getStyleValue('index.php?style=product2') || "product"; $('a.' + selected).addClass('selected'); 

Answer 4

您可以像这样获取jQuery中的当前url：

 $(location).attr('href'); 

然后切断’？’之后的所有内容 使用正则表达式，获取当前页面

要将类添加到正确的li项：

 $('li.'+style+').addClass('active'); 

Answer 5

 var style = ''; if(style == 'product'){ $('li.product').addClass('active'); } 

Answer 6

使用location.href来读取查询参数……

  function getQuerystring(key, default_) { if (default_==null) default_=""; key = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); var regex = new RegExp("[\\?&]"+key+"=([^&#]*)"); var qs = regex.exec(window.location.href); if(qs == null) return default_; else return qs[1]; } var target = $("." + getQueryString("style", "default"));