button on/off with jquery

Question

I am working in Adobe Edge. I have 3 buttons on the stage: v1, v2, v3. When buttons are clicked they move on the timeline.

When button 1 is clicked, it moves on the timeline and shows button 2 enabled, button 1 and 3 disabled.

when button 2 is clicked, it moves on the timeline and shows button 3 enabled, buttons 1 and 2 disabled.

when button 3 is clicked, it moves on the timeline and shows button 1 enabled, buttons 2 and 3 disabled.

I tried to use bind() and unbind() and it works for the first button. However since it unbinds the third button, when I get to the place on the timeline where button 3 should be enabled, it is disabled. I tried to bind the button again in the click event of button 2 but is does not work. How should I handle this?

sym.$("v1").click(function() {
sym.play("p1"); 
sym.$("v1").unbind("click");
sym.$("v3").unbind("click");

});


sym.$("v2").click(function() {
sym.play("p2");
sym.$("v1").unbind("click");
sym.$("v2").unbind("click");
sym.$("v3").bind("click");

});


sym.$("v3").click(function() {
sym.play("p3"); 
sym.$("v1").bind("click");
sym.$("v2").unbind("click");
sym.$("v3").unbind("click");

});

What does "it does not work" mean? Please elaborate. No body is going to be trying to guess how you really want it to work. — d_inevitable, Jun 28 '12 at 18:32
you have no click handlers, jQuery isn't going to guess what to do when click occurs — charlietfl, Jun 28 '12 at 18:38

score 1 · Accepted Answer · answered Jun 28 '12 at 20:03

it should work. good luck

sym.$("v1").click(function() {
    func(1, 2);    
});    
sym.$("v2").click(function() {
    func(2, 3);    
});
sym.$("v3").click(function() {
    func(3, 1);    
});    

function func(i, next) {
    var nextnext = ((next+1)%3 == 0) ? 3 : (next+1)%3;

    sym.play("p"+i);

    sym.$("v1").unbind("click");
    sym.$("v2").unbind("click");
    sym.$("v3").unbind("click");
    sym.$("v"+ next).bind("click", function() { func(next, nextnext); }); 
}

Superb! It works. Thank you so much. Now I have to tried and understand it! But yes, it works. — Edgedudette, Jun 28 '12 at 20:17

score 0 · Answer 2 · answered Jun 28 '12 at 19:00

0

just example

sym.$("#v1, #v2, #v3").bind("click", myFunction);

function myFunction() {
    var id = sym.$(this).attr("id");
    var i  = id.substr(1,3);
    var next = ((i+1)%3 == 0) ? 3 : (i+1)%3;

    sym.play("p"+i);

    sym.$("#v1, #v2, #v3").unbind("click");
    sym.$("#v"+ next).bind("click", myFunction);   
}

it's has been verified

answered Jun 28 '12 at 19:00

see613

494
5
16

hum - not working. The composition starts and none of the buttons work. – Edgedudette Jun 28 '12 at 19:22
In Edge we do not need the #. I tried both with and without. Have you worked in Edge? – Edgedudette Jun 28 '12 at 19:39
I am sorry, this comment is a mess. i cannot make it work to indent the code.
I tried the following and no unbinding occurs. Buttons are always live.
index = 0;
function updateBtn(index){ sym.$("v1, v2, v3").unbind("click"); sym.$("v" + i).bind("click"); } sym.$("v1").click(function(){ sym.play("p1"); updateBtn(2); }); sym.$("v2").click(function(){ sym.play("p2"); updateBtn(3); }); sym.$("v3").click(function(){ sym.play("p3"); updateBtn(1); });
– Edgedudette Jun 28 '12 at 20:06

button on/off with jquery

2 Answers2