Dick Leung
Dick Leung

Reputation: 21

Jquery trigger did not work

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
  </script>
  <title>test trigger</title>
</head>
<body>

  <script>
  $(document).ready(function(){ // on document ready
    $("#testbed").trigger('click'); // click the element
  })
  </script>

  <a id="testbed" href="http://www.google.com">testing</a>
</body>
</html>

I expect this code to automatically click the testbed link when the document is ready. But the link is not clicked.

Upvotes: 1

Views: 319

Answers (8)

schnill
schnill

Reputation: 955

first you should know that .trigger() function cannot be used to mimic native browser events, such as clicking on a file input box or an anchor tag.

$("#testbed").trigger('click'); // it will not change the current page.

you have to use .simulate() to mimic such native browser events,

$( "a" ).simulate( "click" );

To use .simulate() function, you have to include simulate.js in your file.

you can refer to this page, triggering event handelers

Upvotes: 2

Tamillharasan
Tamillharasan

Reputation: 460

Try the following code:

 <script>
  $(document).ready(function(){ // on document ready

   //Following code simulates a click event
    anchorObj =  $("#testbed")[0]; 
    var evt = new MouseEvent('click', {
      'view': window,
      'bubbles': true,
      'cancelable': true
    });
    anchorObj.dispatchEvent(evt);
  });
  </script>

This will work because it simulates actual click event on the anchor. But jQuery click will not work because it will only execute click handlers defined for the element.

Upvotes: 0

InsaneRabbit
InsaneRabbit

Reputation: 316

you can try this,

<script>
$(document).ready(function(){ // on document ready
  $("#testbed")[0].click(); // click the element
})
</script>

Upvotes: 0

Adil
Adil

Reputation: 148140

You need to define click on testbed

$(document).ready(function(){ // on document ready    
    $("#testbed").click(function(){ // on document ready
       alert("clicked");
    });
    $("#testbed").trigger('click'); // click the element
});

If you do not want to have click event and simply want to navigate to href of link then you can use window.location.href = url;

$(document).ready(function(){ // on document ready       
    window.location.href = document.getElementById("testbed").href;
});

Try using native function and properties etc where ever possible, to gain performance. You can check the difference in performance of different attributes access method over jspref.

Upvotes: 1

Fallexe
Fallexe

Reputation: 596

The .click() calls the defined click function. It does not simulate a user click. The following code should give you the functionality you want.

$(document).ready(function(){  

//Define click function
  $("#testbed").click(function(){
     window.location.href = $("#testbed")[0].href;
  });

//Trigger the click event.
  $("#testbed").trigger('click');
});

Upvotes: 0

zzlalani
zzlalani

Reputation: 24374

Why dont you try this

<script>
$(document).ready(function(){ // on document ready
    var url = "http://www.google.com";
    window.location.href = url;
})
</script>

Upvotes: 0

Ryan
Ryan

Reputation: 28207

The click event is triggered. Try for example:

$(document).ready(function(){ // on document ready
    $("#testbed").on ('click', function() {
        alert('click event');
    });

    $("#testbed").trigger('click'); // click the element
})

The actual action of visiting the URL in the href wont happen. You can use window.location to change pages and bypass jQuery.

Upvotes: 1

Jereme
Jereme

Reputation: 651

Trigger is used to execute the click event which your link testbed does not have. If you want to redirect your page to that link why not use window.location.href

window.location.href = $("#testbed").attr('href');

Upvotes: 0

Related Questions