Odd behaviour when I bind an event again

Question

0.00/5 (No votes)

See more:

I hope your 2015 it's being awesome and thank you from beforehand for taking a minute of your time to help me, first of all, I'm a noobie who's been learning by its own...I stumbled upon with the 'unbind' and 'bind' events and that's giving me troubles, please take a peek to the next code:

http://jsfiddle.net/nero_noob/ktf1v8k0/

click at 'stuff1' or in 'stuff2' and you'll see they both have a 'toggle' attached to them, no bid deal...when I click in the button 'unbind' the effect dissapears as I expected but when I want to bind it again clicking in the 'bind' button I've got a problem that you'll notice when trying to click back in either 'stuff1' or 'stuff2', both start 'blinking' and do not behave like at the beggining as I want, how can I solve this problem? 'reset' the effect exactly as it was from the beginning? thanks for your time.

fell free of giving me a bettter approach if you know one

Posted 5-Feb-15 4:17am

edward-l

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Peter Leow · Accepted Answer · 2015-02-05T05:13:00

It behaves in the way that was instructed by the code. You have mixed the 2 div's in one function and attached a second click events to each of them. The result is all mixed up. I have cleaned it up, take a look:

C#

var staff = $("#stuff");
var staff1 = $("#stuff1");
var staff2 = $("#stuff2");
var staff_2 = $("#stuff_2");

staff1.hide();
staff_2.hide();

var toggleStuff = function(event){
    staff1.toggle('slow');
}

var toggleStuff2 = function(event){
    staff_2.toggle('slow');
}

$("#unbind").click(function(){
    staff.unbind('click');
    staff2.unbind('click');
});

$("#bind").click(function(){
    staff.bind('click',toggleStuff);
    staff2.bind('click',toggleStuff2);
});

jsfiddle[^]