5
$("#prevPage").live("click",function(e) {
.................
});

For example, when the user have already clicked on the prevPage, the statement inside it is running, if the user click on it instantly , it will trigger again. However, I would like the click event trigger only after all the statement inside it have finish execution, How to achieve that?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
user782104
  • 13,233
  • 55
  • 172
  • 312

5 Answers5

2

How about this or something similar:

<script type="text/javascript">
    // disable command while function is being executed.
    var sample = { 
        isExecuting : 0, 
        doWork : function (e) { 
            if (sample.isExecuting === 1) return;
            sample.isExecuting = 1;
            // do work -- whatever you please
            sample.isExecuting = 0; // say: I'm done!
        }
    };
    // live or bind
    $("#prevPage").bind("click",function(e) {
         sample.doWork(e);
    });
</script>

simple 'shield' to block a multiple-call scenario.

Glenn Ferrie
  • 10,290
  • 3
  • 42
  • 73
  • what if there is asynchronous execution like `settimeout` , on "do work -- whatever you please" . – rab Mar 05 '13 at 05:08
  • then you defer the "unflag" (sample.isExecuting = 0) until the operation completes. Do you have a callback function in your async operation? – Glenn Ferrie Mar 05 '13 at 05:26
  • async ajax or worker? I will provide a code sample. In all async scenarios, there is a moment where certain operations need to occur synchronously. knowing where that applies is a prerequisite to application development. waiting on feedback – Glenn Ferrie Mar 05 '13 at 05:28
1

Then set a flag on the element to check if it's clickable or not.

$("#prevPage").on("click",function(e) {

  e.preventDefault();

  //get the clickable attribute
  //if it's not existent, its undefined hence "false"
  var unclickable = this.unclickable;

  //if it's not unclickable (it's clickable)
  if(!unclickable){

    //make the flag unclickable
    this.unclickable = true;

    //do stuff

    //reset it back the way it was after operations
    this.unclickable = false;
  }


});
Joseph
  • 117,725
  • 30
  • 181
  • 234
0

use the unbind function of jquery

$("#prevPage").unbind("click");

after your task finished

$("#prevPage").bind("click",function(){....your code here....});
Ravinder Gujiri
  • 1,494
  • 10
  • 14
0

Set a variable that your event triggered

var prevPageEventTriggered = false ;

and set it to ture when event triggered

prevPageEventTriggered = true;

and then add condition for this in click event handler function

$("#prevPage").live("click",function(e) {

        if ( prevPageEventTriggered ) {
                return false;
        }

        // your code goes here
        // ....
});

if it have finish execution, you can set it to false . hope this will helps

rab
  • 4,134
  • 1
  • 29
  • 42
0
  • unbind() will do the work for you.

  • An alternate could be like using detach(). When your process is executing detach the button and when your process finsihes executing, use reattach() to get the button back. What I will suggest is use unbind().

Ayush Bilala
  • 91
  • 1
  • 5