URL87
URL87

Reputation: 11012

Trigger a function multiple time according to button press long time

Suppose there is -

<script>
    function move() {...}
</script>
<input type="button" value="move">

FIDDLE

How could I trigger the move() according to the long time press on <input type="button" value="move"> ?

For example -

A press of 1 second would call move() 50 times , 2 second press would call it 100 times , and so on .

A script which measure the press long time could be found here .

A solution using jQuery would be acceptable too .

Upvotes: 0

Views: 657

Answers (3)

Sam Miller
Sam Miller

Reputation: 166

I would pass the move() function a variable that contains the number of iterations you want to perform. Then, have the move() function call itself recursively until var iterations is 0.

I would see it looking like this:

<script>
function move(iterations){
  //do actions
  //...
  //check if move() should run again
  if(iterations > 0){
    move(iterations-1);
  }
}

Now, your pressTime() function just needs to call move() with the desired iterations. Hope this helps.

Upvotes: 0

JAN
JAN

Reputation: 21865

Check this solution :

function holdit(btn, action, start, speedup) {
    var t;

    var repeat = function () {
        action();
        t = setTimeout(repeat, start);
        start = start / speedup;
    }

    btn.mousedown = function() {
        repeat();
    }

    btn.mouseup = function () {
        clearTimeout(t);
    }
};

/* to use */
holdit(btn, function () { }, 1000, 2); /* x..1000ms..x..500ms..x..250ms..x */

Taken from this Stackoverflow question

Upvotes: 0

aimadnet
aimadnet

Reputation: 423

Try this code :)

$(document).ready(function () {

    var longpress = false;
    var interv;

    function move()
    {
        console.log("move");    
    }

    $("button").on('click', function () {
        (longpress) ? alert("Long Press") : alert("Short Press");
    });

    var startTime, endTime;
    $("button").on('mousedown', function () {
        startTime = new Date().getTime();
        interv = setInterval(function(){
            move();
        }, 100);
    });

    $("button").on('mouseup', function () {
        endTime = new Date().getTime();
        longpress = (endTime - startTime < 500) ? false : true;
        clearInterval(interv);
    });

});

DEMO : http://jsfiddle.net/pZ6FR/1/

Upvotes: 1

Related Questions