DextrousDave
DextrousDave

Reputation: 6793

Jquery toggle between two text variables on click

I have a click function where you click on an anchor tag, it changes the background of that clicked anchor tag and the text in another element on the page. Now when you click on another anchor tag, it should change the text to the second text variable.When a-tag clicked a third time(that is the third anchor tag, I have 3 of them), it should change back to the first text variable again. Here is my example, but can't seem to get it working. Also, the background does not change opacity as it should, but I think it is because it is in a td tag-see example

http://jsfiddle.net/gGAW5/94/

thank you!

Upvotes: 0

Views: 2508

Answers (2)

Tats_innit
Tats_innit

Reputation: 34107

Working demo http://jsfiddle.net/tB3pP/3/

I have just used you r code and did minor changes like var = i and i%2

Behaviour achieved: when you click 1st time its text1 second time its text2 third time its text1 again.

Hope this helps, Please lemme know if I missed anything,

code

$(document).ready(function() {
    var text1 = "My Text 1";
    var text2 = "My Text 2";
    var i = 1;
    $("a").click(function(event) {

        i++;
        if (i%2 != 0) {
            $("#myTitle").html(text1);
            $(this).css("opacity", "0,5");
        }else {
            $("#myTitle").html(text2);
            $(this).css("opacity", "0,9");
        }
    });
});​

Upvotes: 2

Zoltan Toth
Zoltan Toth

Reputation: 47667

Try this - http://jsfiddle.net/gGAW5/96/

var title;

    $(document).ready(function() {
        $("a").click(function() {
            if ( $("#myTitle").text() == "My Title" || $("#myTitle").text() == "My Text 2" ) {
                title = "My Text 1";
            } else {
                title = "My Text 2";
            }

            $("#myTitle").text( title );
            $(this).css("opacity", .5);
        });
    });

Upvotes: 2

Related Questions