Click Button for One function Click Again for Another

I think you can do some thing like this.

<img src= "..." onclick ="Mymethod();" alt="Imagename"/>


var IsCalledOnce = false;

function Mymethod()
{
 if(IsCalledOnce)
{
  //do something
}else
{
 //do something
}

IsCalledOnce = true;
}

You can save the value in global variable scope if for the first time there is no refresh, and refresh for all other time.

if you want to persist thatvalue for longer you can use any of the following

1.HTML5 web storage

2.Cookie

3.Hiddenfield

4.Database(save by ajax call)

You can create a global variable $.clicked and store true when clicked first and load the CSS.

In your function you always checks the value of the global variable and then define what action to take from there.

see:

$(document).ready(function(){
    $.clicked = false;

    $("#loadCSS").click(function(e){
        if ($.clicked){
            // action to be taken to remove the CSS loaded
            $.clicked = false;
        } else {
            // action to be taken to load the CSS
            $.clicked = true;
        }
    });
});

I hope it can help you

You can set a global variable :

jQuery(document).ready(function () {

    $('#test').click(function () {
        test();
    });

});

var calledonetime = false;

function test()
{
    if(calledonetime=== false)
    {
        calledonetime = true;
        alert('first time');
    }else
    {
        alert('second time');
    }

}

So the first time you click, it will do the first action and then, the second.

Here is the exemple.

I made this for myself:

function zo(f1, f2){
  this.n = 0;
  this.z = function(){
    if(this.n === 0){
      f1(); this.n = 1;
    }
    else{
      f2(); this.n = 0; 
    }
  }
}
var whatever = new zo(function(){/*do stuff*/}, function(){/*do stuff*/});

Keep in mind the context of this inside an Event you will want to call in the context of whatever.

Element.onclick = function(){
  whatever.z.call(whatever);
}

<button id="button">click me</button>
<div id="thing">default</div>

and

function first() {
    $('#thing').html("first");
}

function second() {
    $('#thing').html("second");
}


$('#button').on("click", function () {
    first();
    $(this).on("click", function () {
        second();
    });
});

http://jsfiddle.net/stevemarvell/xxJBH/

If you want to remember the state after user reload then you want to store it in a cookie or some such.

Try out this

in html

<a><img id="test" src="temp5.jpg" /></a>

In .js

$(document).ready(function()
{
var action = 1;

    $("#test").click(function()
    {
    if ( action == 1 ) {
            $("#div2").css('display','block');
            action = 2;
        } else {
            $("#div3").css('display','block');
            action = 1;
        }
    });


    });

This is simple and useful.

flag = true ;
function myFunction() {
document.getElementById("demo").innerHTML = flag ? "Second paragraph" : "First paragraph";
flag = !flag
}

<p id="demo">First paragraph</p>
<button onclick="myFunction()">click me</button>

Note: "flag" can be changed.