Question

我试图弄清楚如何编写我认为是一个非常简单的jQuery函数，但可以使用一些帮助。

所以我有一个名为“linkr”的var，我正在使用它。

$('img#button4').attr('u', linkr);

接下来，我有一个连接到链接器的数组

var linkr = [
    'button1',
    'button2',
    'button3']

我试图弄清楚如何遍历linkr变量中的值，每5秒一次只显示一个。

基本上，代码代表

$('img#button4').attr('u', 'button1');

5秒后

    $('img#button4').attr('u', 'button2');

等等。提前感谢您提供的任何帮助或建议。

Answer 1

var currentIndex = 0; //set this as a global variable i.e. before everything and not inside a function
...
...
setInterval(function(){
    $('img#button4').attr('u', linkr[currentIndex]);
    currentIndex = currentIndex < linkr.length -1 ? currentIndex + 1 : 0;
}, 5000);

Answer 2

只需将按钮交换包装在一个函数中，然后使用setInterval

var buttonTimer = setInterval(buttonFunction, 5000);

    function buttonFunction() {
      ... your button function
    }

    function abortButtonTimer() { // to be called when you want to stop the timer
      clearInterval(buttonTimer);
    }

Answer 3

你想设置一个间隔来更新button4，然后当它超出数组范围时清除它。

var iterator = 0;
var timer;

timer = setInterval(function () {
  if (iterator <= linkr.length) {
    $('img#button4').attr('u', linkr[iterator]);
    iterator++;
  }
  else {
    clearTimeout(timer);
  }
}, 5000);

Answer 4

使用data属性而非u属性。
我将向您展示如何使用alt图片属性实现您想要的效果：

的 LIVE DEMO

您所需要的一切：

var c = 0; // a dummy counter :) setInterval(function() { $('img#button4').attr('alt', linkr[++c%linkr.length]); // or use 'u' only if REALLY needed } ,1000 ); // demo only, use 5000 instead

使用data-*属性应如下所示：

$('img#button4').data('u', linkr[++c%linkr.length]);

Answer 5

我认为这就是你要找的，假设“sel”是一个有效的选择器，“attr”是选择器的有效属性，“linkr”是一个有效的数组，包含“ ATTR“：

// global vars  - prefixed with "g"
var gidx = 0;
var gsel = "";
var gattr = "";
var glinkr = [];
var gLoopLinkr = null;

// call this function to set up linkr
function LoopLinkr( sel, attr, linkr ){
    gidx = 0; // reset
    gsel = sel;
    gattr = attr;
    glinkr = linkr;
    gLoopLinkr = window.setInterval("DoLoopLinkr", 5000 );
}

function DoLoopLinkr(){
    $(gsel).attr( gatt, linkr[gidx] );
    gidx++;

    // decide how to end this routine ..
    if (gidx=glinkr.length){ 
        // stop doing this
        window.clearInterval( gLoopLinkr );
        // or loop back to the begining and coninue on
        // gidx=0;
    }
}

// e.g. call
LoopLinkr("#mydiv", "background", ["img1.jpg", "img2.jpg", "img3.jpg"] );

简单的jQuery循环＆amp;返回当前值

5 个答案: