CODEWITHSUNDEEP
jquerytriggers
Val
Val

Reputation: 17522

jquery trigger bug

I have this

...
<li style="padding: 50px;">
   <a href="blabla" style="background:red;">Click Me</a>
</li>
...

As you all may know that the <a> tag will be smaller in size. I want to use jquery as so...

$('li').click(function (){
   $(this).find('a').trigger('click');//does not work :(
   alert($(this).find('a').attr('href'););//returns blabla//which is correct
});

Any ideas why the <a> cannot be triggered in this way ? PS

Upvotes: 0

Views: 362

Answers (5)

Blowsie
Blowsie

Reputation: 40535

 $(this).find('a').trigger('click')

Only triggers the javascript event , and not the default events

Here is the fix

$('li').click(function (){
    var url =  $(this).find('a').attr('href');
    location.href= url
});

Here is a working example

You could simplify it too:

$('li').click(function (){
    location.href= $(this).find('a').attr('href');
});

Upvotes: 1

aefxx
aefxx

Reputation: 25249

With JavaScript you can't have the browser's native click simulated. You would have to setup an event handler for your link that indeed does get fired once you trigger 'click'. From there you could go with SLaks location = ... method.

Upvotes: 0

MatTheCat
MatTheCat

Reputation: 18721

I think CSS is enough to do what you want...

What you want is just link tags take all <li> space. In many cases display:block; on <a> tags is enough but I don't know anything about your HTML/CSS ^^

Upvotes: 0

user191152
user191152

Reputation:

How about: 

$(this).find("a:first").click();

I guess it's because you haven't bound the "a"'s onclick event to anything using jQuery :-)

Upvotes: 0

SLaks
SLaks

Reputation: 887479

jQuery's trigger function will call event handlers registered using jQuery.

It will not simulate a real click.

Instead, you can write 

location = $(this).find('a').attr('href');

Upvotes: 4

Related Questions