Can't click anchor tag using click() function

Question

I want instead of pressing the link of the anchor tag to load the page in href attributre I want the anchor invisible for the user, and clickable via the button provided.

This is the code:

<!DOCTYPE html>
<html>
<head>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script type="text/javascript">
  $(document).ready(function(){

      $("button").click(function(){
          $("a").click();
       });

  });
 </script>
</head>
<body>
<body>
 <a href="http://www.touchwand.com/wp-content/uploads/2018/04/Icons-and-backgrounds.zip"></a>
 <button >Button1</button>
</body>

If I click directly on the anchor I get to the URL, but via button it doesnt work. Why is not <a> clicked by the click() function? Why is it not working?

Try to use something like [event.preventDefault](https://api.jquery.com/event.preventdefault/) — Gabriel Carneiro, May 14 '18 at 14:29
@GabrielCarneiro - `preventDefault` isn't necessary here, the button isn't in a form. — T.J. Crowder, May 14 '18 at 14:31
`$("button").click(function(){ window.location = $('a').attr('href'); });` — Abdel mounaim, May 14 '18 at 14:33

score -1 · Answer 1 · answered May 14 '18 at 14:34

Which device did you test it on? On mobile devices you have to get an initial user interaction to be able to execute Javascript.

You could also do something like:

$("button").on("click", function() {
    window.location.href = $("a")[0].href;
}

Would this help? Can you provide more information?

Ref: How to get the browser to navigate to URL in JavaScript

Can't click anchor tag using click() function

1 Answers1