Question 10847 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

How to hide URL from <a> tag, so it's not showing in HTML to bots and visitors – Jquery

Is there a simple way in CSS/HTML or jquery to hide url from external views, but still keep link clickable, so URL opens only when user actually clicked.

Ex. Link to Page

Label shows but url is not.

Tags:

2

Answers


  1. 0

    Use The Window Location Object:

    function myFunction() {
  location.href = "http://www.yoururl.com";
}
    <button onclick="myFunction()">Take me to your url</button>
    Login or Signup to reply.
  2. 0

    You can use javascript to display javascript:void(0) in the link to hide it, then when the user clicks it will send them to the website you want.

      <head>
    <title>Hide URL Example</title>
    <style>
      .link {
        text-decoration: none;
      }
    </style>
  </head>
  <body>
    <p>
      Here is a <a href="javascript:void(0);" class="link" data-url="http://www.google.com/">Link to Page</a>
    </p>

        <script>
      const links = document.querySelectorAll('.link');
      links.forEach((link) => {
        link.addEventListener('click', (event) => {
          event.preventDefault();
          const url = link.getAttribute('data-url');
          window.location.href = url;
        });
      });
    </script>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search