Question

I have the following script:

$('#target').bind('click', 
                        function () {
                            $('#target').css({ 'display': 'none' });
                            $('#targetFake').css({ 'display': 'inline-block' });
                        },
                        function () {
                            alert('bind callback'); 
                        });

The ‘bind callback’ alert seems to be triggering everytime that the ‘#target’ element is being clicked instead of only once when the element is being bound. Can I make a callback to verify that the binding is happening once?

Answer 1

That’s how it should be working: one trigger per click event. The binding happens once per bind call; if you accidentally call bind multiple times with the same handler you will see the handler triggered multiple times by just one click.

However: what are the two functions doing in your bind call? There is no overload that accepts two functions.

Other alternatives you might be looking for are:

• Calling a function only once on the spot — just call it directly, you don’t need jQuery for that.
• Binding a handler that only gets triggered the first time the event happens — use one for this purpose.
• Binding a handler normally and calling it once on the spot; you can do this with $(...).bind('click', ...).trigger('click').