How to tell JavaScript to do nothing?

Question

I have a small chunk of code, like this:

$("div.footerMenu li").click(
    function () {
        $("div.onScreen").hide();
        $(this).children("div.onScreen").fadeIn('fast');    
    },function(){
        $("div.onScreen").hide();
});//click

And when I click on <li> the div .onScreen shows nicely, but when i click on this div, that just showed up the functions is hiding in and showing again, but I don't want it to execute this function again. So my question is: How can I somehow "detach/exclude/hide" this div from Javascript?

update:

The thing is that with this method and with others with .one() the rest of menu is not working. There is the site with the problem here . I want this div that shows up stay there, when I click on it, but when I click on their items <li> I want to other div's (submenus) to show up (warning - big images on that site).

The html looks like this:

<div class="footerMenu"> <ul> <li>HOME<div class="onScreen"><div style="padding:50px;"><img src="fillTxt.png"></div></div></li> <li>PLENER<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt2.png"></div></div> </li> <li>STUDIO<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt.png"></div></div> </li> <li>INNE<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt2.png"></div></div> </li> </ul> </div>

I edited your post because apparently you don't know the difference between Java and JavaScript. Unless of course you've forgotten to mention an interaction with a Java plug-in. — zzzzBov, Jan 31 '11 at 20:34
frankly speaking, you'r right, I do not know :( I hope someday this will change ;) — Szymon, Jan 31 '11 at 20:39
[You should probably read this then](http://stackoverflow.com/questions/245062/whats-the-difference-between-javascript-and-java). — zzzzBov, Jan 31 '11 at 20:41
There are two functions being passed in to "click". Are you sure you don't want "toggle" instead? — Pointy, Jan 31 '11 at 20:42
Please describe what your code is *supposed* to do, and post relevant HTML markup. I have a feeling that `bind/unbind` solutions are the wrong approach. **EDIT:** With regard to the update, which menus are you talking about? You have 2 sets on the page. — user113716, Jan 31 '11 at 21:02
@Szymon : I removed my answer since it irrelevant to the current state of the question. I propose a close and start all over? No offense but this gets a useless mess. — Caspar Kleijne, Jan 31 '11 at 21:12
I really want to help you, and so do many others, but perjhaps you could post a NEW question in a NEW POST with a clearer description ;) (no offense) — Caspar Kleijne, Jan 31 '11 at 21:14

score 4 · Answer 1 · answered Jan 31 '11 at 20:39

The simple solution is:

$('div.footerMenu li').unbind('click');

But should you have multiple click handlers on the selector, you may want to only remove one at a time. The way to do that is to store a reference to the function being passed:

function hideItem()
{
  ...code...
  //unbind the click event
  $(this).unbind('click', hideItem);
}

$('div.footerMenu li').click(hideItem);

Frédéric Hamidi · Answer 2 · 2011-03-31T18:12:50.353

2

If you want to handle an event only once, you can use the one() method:

$("div.footerMenu li").one("click", function() {
    $("div.onScreen").hide();
    $(this).children("div.onScreen").fadeIn("fast");    
});

edited Mar 31 '11 at 18:12

answered Jan 31 '11 at 20:41

Frédéric Hamidi

258,201
41
486
479

Ken Redler · Answer 3 · 2011-01-31T20:47:34.567

0

You can use .one():

$("div.footerMenu li").one('click', function(){
    things_to_happen_only_once();
    // unbinding happens automatically
});

edited Jan 31 '11 at 20:47

answered Jan 31 '11 at 20:42

Ken Redler

23,863
8
57
69

How to tell JavaScript to do nothing?

3 Answers3