每隔几秒使用setInvernal调用一个查询函数?

时间:2011-04-06 09:12:37

标签: javascript jquery

这里真的很容易,我敢肯定 - 我是一个正在努力将setInterval集成到我的jQuery中的初学者。我目前有这个功能,它可以在点击它们时旋转两个图像。我希望这会自动发生(每隔几秒),似乎无法找到使用setInterval的正确方法。

有人能指出我正确的方向吗?非常感谢您的帮助。

菲利普

$(document).ready(function(){
$("#spinitemholder1 .sponsorFlipphil1 img").click(function () {
          $(this).animate({ "width": "0px", "margin-left": "135px" }, 500, function () {
              $(this).parent().hide();
              $(this).width(0);
              $("#spinitemholder1 .sponsorFlipphil2 img").animate({ "width": "271px", "margin-left": "0px" });
              $("#spinitemholder1 .sponsorFlipphil2").show();
          });
      });
      $("#spinitemholder2 .sponsorFlipphil2 img").click(function () {
          $(this).animate({ "width": "0px", "margin-left": "135px" }, 500, function () {
              $(this).parent().hide();
              $(this).width(0);
              $("#spinitemholder1 .sponsorFlipphil1 img").animate({ "width": "271px", "margin-left": "0px" });
              $("#spinitemholder1 .sponsorFlipphil1").show();
          });
      });

});

2 个答案:

答案 0 :(得分:0)

尝试运行

setInterval( function(){
    $('#spinitemholder1 .sponsorFlipphil1 img, #spinitemholder2 .sponsorFlipphil2 img' ).click();
}, 2000);

看看它是否有效。 (只是为了测试代码,这不是建议的方法

答案 1 :(得分:0)

试试这个:

var interval = setInterval(function () {
  $("#spinitemholder1 .sponsorFlipphil1 img").trigger("click");
  $("#spinitemholder2 .sponsorFlipphil2 img").trigger("click");
}, 5000);

你必须使用“触发器”。我建议在用户点击其中一个图像时重置间隔。一个简单的方法是:

var interval = 0;
function startNewInterval() {
  clearInterval(interval); // clear previous one
  interval = setInterval(function () { // start new interval
    $("#spinitemholder1 .sponsorFlipphil1 img").trigger("click");
    $("#spinitemholder2 .sponsorFlipphil2 img").trigger("click");
  }, 5000);
}

$("#spinitemholder1 .sponsorFlipphil1 img").click(function () {
  $(this).animate({ "width": "0px", "margin-left": "135px" }, 500, function () {
    $(this).parent().hide();
    $(this).width(0);
    $("#spinitemholder1 .sponsorFlipphil2 img").animate({ "width": "271px", "margin-left": "0px" });
    $("#spinitemholder1 .sponsorFlipphil2").show();
    startNewInterval();
  });
});

$("#spinitemholder2 .sponsorFlipphil2 img").click(function () {
  $(this).animate({ "width": "0px", "margin-left": "135px" }, 500, function () {
    $(this).parent().hide();
    $(this).width(0);
    $("#spinitemholder1 .sponsorFlipphil1 img").animate({ "width": "271px", "margin-left": "0px" });
    $("#spinitemholder1 .sponsorFlipphil1").show();
    startNewInterval();
  });
});

startNewInterval();