I want to change the value to the next number on each click...once it reaches the end it repeats from beginning...
html:
<button id="button">Click me</button>
<br />
<br />
<div id="info"></div>
javascript:
var arr = [10001, 10302, 12303, 11004, 10044];
$(document).on('click', '#button', function() {
$.each(arr, function(key, val) {
$('#info').text(arr[key]);
});
return false;
});
Just put the index into a var, i in this instance, and increment the value on each click. Also make sure to check if i is equal to the length of the array, if so reset it.
var arr = [10001, 10302, 12303, 11004, 10044],
i = 0;
$(document).on('click', '#button', function() {
if(i === arr.length){
i = 0;
}
$('#info').text(arr[i]);
i++;
return false;
});
if you store an index and increment it on each click, should work
var arr = [10001, 10302, 12303, 11004, 10044];
var i = 0;
$(document).on('click', '#button', function() {
i++;
$('#info').text(arr[i%arr.length]);
return false;
});
Pretty simple, get the current index of the current number, check the length, if at the end, repeat:
var arr = [10001, 10302, 12303, 11004, 10044];
$(document).on('click', '#button', function() {
var current = parseInt($("#info").text(), 10),
currentIndex = arr.indexOf(current);
var value;
if (currentIndex == (arr.length - 1)) {
value = arr[0];
} else {
value = arr[++currentIndex];
}
$("#info").text(value);
});
