ansaurus

Question

JQuery - add click event to LI or SPAN elements?

Answer 1

+4 A:

You sure you have jquery 1.3 included in your code? The following works fine (direct copy and paste from your question) for me when I click on any of the LIs:

<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function updateNavigation(title) {
    alert(title);
}

$("#Navigation li").live('click', function(e) { 
    e.preventDefault; 
    this.blur(); 
    return updateNavigation($(this).attr('title')); 
});

</script>
</head>
<body>
<div id="Navigation">
<ul>
    <li class="navPrevNext inactive">|&lt; First Page</li>
    <li class="navPrevNext inactive">&lt; Prev Page</li>
    <li class="navIndex selected" title="0 ">1</li>
    <li class="navIndex notselected" title="1 ">2</li>
    <li class="navIndex notselected" title="2 ">3</li>
    <li class="navPrevNext active" title="1">Next Page &gt;</li>
    <li class="navPrevNext active" title="2">Last Page &gt;|</li>
</ul>
</div>
</body>
</html>

Are you sure your updateNavigation function is working right? Maybe it's being triggered but something is wrong within it...

Parrots 2009-05-07 17:37:46

My dev environment was conspiring against me. After a reboot my JS file was updated and it worked as expected. Seems the older file was being held in the temp cache. <grrr/>Thanks for the confirmation!

Keith Barrows 2009-05-07 17:46:35

Answer 2

A:

I did the same thing as @Parrots and it works for me. You might, however, want to change your selector to:

$("#Navigation li[title]" ).live('click', function(e) {
     e.preventDefault;
     this.blur();
     return updateNavigation($(this).attr('title'));
});

So that the handler is only applied to elements that have a title attribute.

tvanfosson 2009-05-07 17:47:41

Thanks - I will try that out! (Better to avoid errors than handle them later)

Keith Barrows 2009-05-07 18:24:34

Works like a champ!

Keith Barrows 2009-05-07 19:21:31

Answer 3

A:

I had a similar problem where I was using a popup list that the user selected. Basically the user clicks an input box and a ul is revealed.

This worked great with a 500ms animation, but when switching to 250ms the scrolling down animation was too fast and apparently the click event never fired on a li.

Drew 2009-12-09 23:14:08

Answer 4

A:

@Parrots Thank you!...I was in a similar trouble too.

Omar 2010-08-05 05:13:23

ansaurus

tags:

views:

answers:

JQuery - add click event to LI or SPAN elements?

related questions