javascript - How to use location.href instead of location.pathname - Stack Overflow

admin管理员组

文章数量:1405393

My Javascript function looks like that:

       function markActiveLink() {

            var path = location.pathname;
            var home = "/";

            if (path == home)
                return
            $("a[href='" + [path || home] + "']").parents("li").each(function () {
                $(this).removeClass('menu_item');
                $(this).addClass("menu_item_active");
            });
        }

But I want to use document.location.href instead of location.pathname to find links. I have tried just change it, but then function is not working at all -> none of my links are selected.

Code of some of my links looks like that:

 <ul>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserOrder.aspx?id=<%=pe.UserId%>&type=NMO">
                <%=Me.GetLocalResourceObject("NMOrders.Text")%>
            </a></li>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserOrder.aspx?id=<%=pe.UserId%>&type=MO">
                <%=Me.GetLocalResourceObject("MOrders.Text")%>
            </a></li>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserPage.aspx?id=<%=pe.UserId%>">
                <%=Me.GetLocalResourceObject("UserPage.Text")%>
            </a></li>
        </ul>

And on page those links source looks like that:

<ul>
                <li><a href="/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=NMO">
                    User Orders NMO
                </a></li>
                <li><a href="/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=MO">
                    User Orders MO
                </a></li>
                <li><a href="/App/User/UserPage.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1">
                    User Page
                </a></li>
</ul>

And with those links valuse of location.pathname would be only /App/User/UserOrder.aspx and I need to check whole link. That's why I am trying to use location.href instead.

location.href is for example: http://localhost/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=MO and then location.pathname is: /App/User/UserOrder.aspx

Any help here much appreciated!

My Javascript function looks like that:

       function markActiveLink() {

            var path = location.pathname;
            var home = "/";

            if (path == home)
                return
            $("a[href='" + [path || home] + "']").parents("li").each(function () {
                $(this).removeClass('menu_item');
                $(this).addClass("menu_item_active");
            });
        }

But I want to use document.location.href instead of location.pathname to find links. I have tried just change it, but then function is not working at all -> none of my links are selected.

Code of some of my links looks like that:

 <ul>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserOrder.aspx?id=<%=pe.UserId%>&type=NMO">
                <%=Me.GetLocalResourceObject("NMOrders.Text")%>
            </a></li>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserOrder.aspx?id=<%=pe.UserId%>&type=MO">
                <%=Me.GetLocalResourceObject("MOrders.Text")%>
            </a></li>
            <li><a href="<%=System.Configuration.ConfigurationManager.AppSettings("VirtualDirectory").ToString()%>User/UserPage.aspx?id=<%=pe.UserId%>">
                <%=Me.GetLocalResourceObject("UserPage.Text")%>
            </a></li>
        </ul>

And on page those links source looks like that:

<ul>
                <li><a href="/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=NMO">
                    User Orders NMO
                </a></li>
                <li><a href="/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=MO">
                    User Orders MO
                </a></li>
                <li><a href="/App/User/UserPage.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1">
                    User Page
                </a></li>
</ul>

And with those links valuse of location.pathname would be only /App/User/UserOrder.aspx and I need to check whole link. That's why I am trying to use location.href instead.

location.href is for example: http://localhost/App/User/UserOrder.aspx?id=949abc91-a644-4a02-aebf-96da3ac7d8e1&type=MO and then location.pathname is: /App/User/UserOrder.aspx

Any help here much appreciated!

• javascript
• jquery
• html

Share Improve this question Follow edited Aug 4, 2011 at 15:49 Marta asked Aug 4, 2011 at 13:59 MartaMarta 2,9571313 gold badges4747 silver badges6969 bronze badges 2

• Could you post examples of output from location.pathname and location.href as well as examples of the links you're trying to select? That would be really helpful in figuring out the issue. – alnorth29 Commented Aug 4, 2011 at 14:30
• I added source code of links and also location.pathname and location.href of example link that I would like to have selected. – Marta Commented Aug 4, 2011 at 15:49

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

Use string concatenation to include the query:

var path = location.pathname + location.search;

Obviously location.href contains text (the protocol and hostname: "http://localhost/") that is not in the links.

You'll either need to remove this from location.href before doing your parisons, or add it to your links.

It is just location.href or window.location.href and not document.location.href

Try this

function markActiveLink() {

            var path = location.pathname;
            var home = "/", $this, href, locationHref = location.href.toLowerCase();

            if (path == home)
                return;

            $("ul li").removeClass('menu_item');

            $("ul a").each(function () {
                $this = $(this);
                href = $this.attr("href").toLowerCase();
                if(locationHref.substring(locationHref.length - href.length) == href) 
                {
                  $this.closest("li").addClass("menu_item_active");
                  return false;
                } 
            });
        }

本文标签： javascriptHow to use locationhref instead of locationpathnameStack Overflow