How to Get the Anchor from the Url Using Jquery

How to get the anchor from the URL using jQuery?

You can use the .indexOf() and .substring(), like this:

var url = "www.aaa.com/task1/1.3.html#a_1";
var hash = url.substring(url.indexOf("#")+1);

You can give it a try here, if it may not have a # in it, do an if(url.indexOf("#") != -1) check like this:

var url = "www.aaa.com/task1/1.3.html#a_1", idx = url.indexOf("#");
var hash = idx != -1 ? url.substring(idx+1) : "";

---

If this is the current page URL, you can just use window.location.hash to get it, and replace the # if you wish.

how get anchor tag url hash values in jquery?

.hash isn't a property of a jquery object, but rather is a property of an HTMLAnchorElement (a class which extends from the Element class), thus you're getting undefined.

So, instead of creating a jQuery object using $(this), you can reference the actual element by just using this:

$(function() {  // get current url hash values.  var current = window.location.hash;
  $('#navbarSupportedContent ul li a').each(function() {    alert(this.hash);  });});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="collapse navbar-collapse" id="navbarSupportedContent">  <ul class="navbar-nav mr-auto">    <li class="nav-item active">      <a class="nav-link" href="index.php">Home        </a>    </li>    <li class="nav-item">      <a class="nav-link" href="index.php#aboutus">About Us</a>    </li>  </ul></div>

Jquery: How do I get the url of an anchor contained within a clicked 'li' tag?

$('.prodcat-line').click(function(){
    alert($('a', this).attr('href'));
    return false;
});

Example here.

Find an a anchor with matching url and addclass using jquery

You need to create an attribute-value selector.

As there are multiple elements in the array, you can use join to create a selector for all the links instead of looping over array and selecting the elements one by one.

'a[href="' + HighlightMenuItems.join('"], a[href="') + '"]';

By using above statement the selector created is as follow:

a[href="/en/about-us/"], a[href="/en/video-gallery/"]

Which can then be passed to jQuery to select the elements form DOM.

Here's updated Pen: http://codepen.io/anon/pen/gamBPE

jQuery(document).ready(function() {  var HighlightMenuItems = ['/en/about-us/', '/en/video-gallery/'];
  var menuSelector = 'a[href="' + HighlightMenuItems.join('"], a[href="') + '"]';
  $(menuSelector).addClass('active-menu');});

.active-menu {  color: green;  font-weight: bold;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script><div id="cssmenu">  <div id="menu-button"></div>  <ul>    <li><a href="/en/about-us/">About Us</a>    </li>    <li class="has-sub">      <span class="submenu-button"></span><a href="/en/photo-gallery/">Gallery </a>      <ul>        <li><a href="/en/photo-gallery/">Photo Gallery</a>        </li>        <li><a href="/en/video-gallery/">Video Gallery</a>        </li>        <li><a href="/en/instagram-gallery/">Instagram Gallery</a>        </li>      </ul>    </li>    <li><a href="/en/news/">News</a>    </li>    <li><a href="/en/contact/">Contact</a>    </li>  </ul></div>

Get #anchor for URL using jQuery ?

You can change the initial hide to be based on window.location.hash, by replacing this:

$("#red-products").hide();  

With this:

$("#red-products, #red-information").hide();
$("#red-" + (window.location.hash.replace("#", "") || "information")).show();

This will hide both initially, then show the hasd (#red-hashhere), or default to showing #red-information as you have now.

How to get anchor text/href on click using jQuery?

Note: Apply the class info_link to any link you want to get the info from.

<a class="info_link" href="~/Resumes/Resumes1271354404687.docx">
    ~/Resumes/Resumes1271354404687.docx
</a>

For href:

$(function(){
  $('.info_link').click(function(){
    alert($(this).attr('href'));
    // or alert($(this).hash();
  });
});

For Text:

$(function(){
  $('.info_link').click(function(){
    alert($(this).text());
  });
});

.

Update Based On Question Edit

You can get them like this now:

For href:

$(function(){
  $('div.res a').click(function(){
    alert($(this).attr('href'));
    // or alert($(this).hash();
  });
});

For Text:

$(function(){
  $('div.res a').click(function(){
    alert($(this).text());
  });
});

jQuery: simplest way to check URL for a parameter and pass it to anchor href if it exists

Client side the simplest is use the URL API

var mainUrl = new URL(location.href);// Won't work in this demo so hard code hrefmainUrl = new URL('http://example.com?a=foo&b=2');
var paramA = mainUrl.searchParams.get('a');
$('a.hyperlink').prop('href', function(){   var url = new URL(this.href);   url.searchParams.set('a', paramA);     return url;})// set query params as text just for demo.text(function(){  return 'Query Params: ' + this.search;})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><a href="page1.php?a=1" class="hyperlink">Link 1</a><br/><a href="page2.php?b=1&a=1" class="hyperlink">Link 2</a>

---

Related Topics