Question

我有一些标签：

<!-- Nav tabs -->
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" id="hometab" class="active"><a href="http://www.mypage.com/" >Home</a></li>
    <li role="presentation" id="contenttab"><a href="#content" aria-controls="content" role="tab" data-toggle="tab">content</a></li>
  </ul>

  <!-- Tab panes -->
  <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="home">home</div>
    <div role="tabpanel" class="tab-pane" id="content">content</div>
  </div>

当我的网址包含字符串?dir时，我想在标签中添加一个类。

例如：如果我的网址为www.mypage.com/?dir=something，则#contenttab应处于有效状态。如果网址仅为www.mypage.com，则#contenttab不应处于有效状态，但#hometab应处于有效状态。

    <script type="text/javascript">
$(document).ready(function() {
    var url = location.pathname;
    if ("url:contains('?dir')") {
        $("#contenttab").attr("class","active");
        $("#hometab").removeClass("active");

    } else {
    $("#contenttab").removeClass("active");
    $("#hometab").attr("class","active");
    }

});        
</script>

我的脚本无效。 #contenttab始终处于有效状态，#hometab永远不会有效。

Answer 1

尝试检查：

if ( url.indexOf( '?dir' ) !== -1 ) { ... }

或尝试：

var url = location.search; // or location.href;

if ( url.indexOf( '?dir' ) !== -1 ) { ... }

Answer 2

    var url = location.pathname;

    if (url.indexOf('?dir') > -1) {
        $("#contenttab").attr("class", "active");
        $("#hometab").removeClass("active");

    } else {
        $("#contenttab").removeClass("active");
        $("#hometab").attr("class", "active");
    }

Answer 3

尝试使用测试：

<script type="text/javascript">
        $(document).ready(function() {
            if (/\?dir/.test(location.pathname)){
                $("#contenttab").attr("class","active");
                $("#hometab").removeClass("active");
            } else {
                $("#contenttab").removeClass("active");
                $("#hometab").attr("class","active");
            }
        });        
</script>

感谢答案 How can I get query string values in JavaScript? 我认为最好和最安全的方法就是获得所需的查询字符串参数 dir 。当然，函数 getParameterByName（）将返回用于获取任何其他查询字符串参数。

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
    results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

var dir=getParameterByName('dir');

$(document).ready(function() {
    if (dir==''){
        $("#contenttab").attr("class","active");
        $("#hometab").removeClass("active");
    } else {
        $("#contenttab").removeClass("active");
        $("#hometab").attr("class","active");
    }
});

注意：如果参数多次出现（？dir = lorem＆amp; dir = ipsum ），你将获得第一个值（lorem）。

当URL包含特定字符串时，如何向元素添加/删除类？

3 个答案: