Enable disable anchor, Jquery

Question

Here is the html:

<ul>
    <li><a href="http://xyz.com"><img src="./xyz.png"/></a></li>
    <li><a href="http://xyz.com"><img src="./xyz.png"/></a></li>
    <li><a href="http://xyz.com"><img src="./xyz.png"/></a></li>
    <li><a href="http://xyz.com"><img src="./xyz.png"/></a></li>

</ul>

If I click the second li it should go to the link but not if I click any other li. I have this code, I want to know a way to enable the default action.

 $(li[k]).click(function(){//increase the height});
 $(li[k]).find('a').click(function(e) {
    e.preventDefault();
    });

Answer 1

I'd suggest something like the following:

 $(li[k]).click(function(){//increase the height});
 $(li[k]).find('a').click(function(e) {
        if ($(this).parent().index() != 1){
            e.preventDefault();
        }
    });

The way that this works is that if the index() of the clicked li element (based on its position among its siblings) is not equal to 1 (JavaScript arrays being zero-based, 1 is the second element in the array), the e.preventDefault() fires; otherwise (if the index() is equal to 1) the default action is permitted.

Answer 2

If I understand correctly, you want to re-enable the default behavior of one of the links?

You can do that like this:

$(li[k]).find('a').unbind("click");

This will remove the click handler from the selected element, essentially returning it to its default behavior.