CODEWITHSUNDEEP
javascriptjquery
Dendy Yang
Dendy Yang

Reputation: 11

JQuery Auto Click

I have a problem, I have 3 button lets say it's called #pos1, #pos2 and #pos3. I want to makes it automatically click #pos1 button in 2 seconds, after that click the #pos2 after another 2 seconds, and #pos3 after another 2 seconds, after that back to the #pos1 in another 2 seconds and so on via jQuery.

HTML

<button id="pos1">Pos1</button> 
<button id="pos2">Pos2</button> 
<button id="pos3">Pos3</button>

Anyone can help me please?

Upvotes: 0

Views: 7858

Answers (5)

Arun P Johny
Arun P Johny

Reputation: 388316

Try

$(function() {
    var timeout;
    var count = $('button[id^=pos]').length;
    $('button[id^=pos]').click(function() {
        var $this = $(this);
        var id = $this.attr('id');
        var next = parseInt(id.substring(4), 10) + 1;

            if( next >= count ){
                next = 1
            }

        if (timeout) {
            clearTimeout(timeout);
        }

        timeout = setTimeout(function() {
                    $('#pos' + next).trigger('click');
                }, 2000);
    })
    timeout = setTimeout(function() {
        $('#pos1').trigger('click');
    }, 2000);
})

Upvotes: 1

bipen
bipen

Reputation: 36531

using setInterval()

Calls a function or executes a code snippet repeatedly, with a fixed time delay between each call to that function.

var tempArray = ["pos1", "pos2", "pos3"]; //create an array to loop through
var arrayCounter = 0;

setInterval(function() {
  $('#' + tempArray[arrayCounter ]).trigger('click');
   arrayCounter = arrayCounter <2 ? arrayCounter +1 : 0;
}, 2000);

fiddle here

check your console for fiddle example

Upvotes: 0

Raman
Raman

Reputation: 1376

If I have understood you question right, you need to perform click in a continuous loop in the order pos1>pos2>pos3>pos1>pos2 and so on. If this is what you want, you can use jQuery window.setTimeout for this. Code will be something like this:

window.setTimeout(performClick, 2000);
var nextClick = 1;

function performClick() {
  if(nextClick == 1)
  { 
      $("#pos1").trigger("click");
      nextClick = 2;
  }
  else if(nextClick==2)
  {
      $("#pos2").trigger("click");
      nextClick = 3;
  }
  else if(nextClick == 3)
  {
      $("#pos3").trigger("click");
      nextClick = 1;
  }

  window.setTimeout(performClick, 2000);
}

This is quite buggy but will solve your problem.

Upvotes: 0

Chris
Chris

Reputation: 518

Well I don't know what you already have but technically it could be done via triggerHandler()

var currentPos = 1,
    posCount   = 3; 

autoclick = function() {
    $('#pos'+currentPos).triggerHandler('click');
    currentPos++;
    if(currentPos > posCount) { currentPos = 1; }
};

window.setInterval(autoclick,2000);

Upvotes: 0

A.Kalkhoff
A.Kalkhoff

Reputation: 146

var posArray = ["#pos1", "#pos2", "#pos3"];
var counter = 0;

setInterval(function() {
   $(posArray[counter]).triggerHandler('click');
   counter = ((counter<2) ? counter+1 : 0);
}, 2000);

That should do the trick, though you did not mention when you want it to stop running.

Upvotes: 0

Related Questions