如何在 jquery 中按时间间隔旋转包含唯一类的特定标记内的值数组？

发布于 2024-09-29 18:27:57 字数 788 浏览 6 评论 0原文

在下面的代码中，我尝试使用包含字符数组的 value 属性来创建具有 class "rot" 的对象来更改内部 HTML。

我希望这些字符会按一定间隔轮换。

我注意到问题出在内部 for 循环中 - 我需要一个 setTimeout 或类似的东西，但它不起作用。

这个问题有什么解决办法吗？

提前致谢。

<script src="http://code.jquery.com/jquery-latest.min.js"></script>


<span class="rot" value="$^%^@">currency</span>
<span class="rot" value="1^2^3">numbers</span>


<script>
function rotateItem()
{ 
 for(j=0;j<$(".rot").get().length;j++)
 {
  valueToRotate = $(".rot:eq("+j+")").attr("value").split("^"); 

  for(i=0;i<valueToRotate.length;i++)
  {
   $(".rot:eq("+j+")").html(valueToRotate[i]);
  }
 }
}
setInterval("rotateItem()",1000)
</script>

原文

In the below piece of code I tried to make the objects with class "rot" to change the inner HTML by using the value attribute that includes an array of chars.

I want that this characters will rotate with an interval.

I noticed that the problem is in the inner for loop - I need there a setTimeout or something like this but it doesn't work.

any solution for this problem?

Thanks in advance.

<script src="http://code.jquery.com/jquery-latest.min.js"></script>


<span class="rot" value="$^%^@">currency</span>
<span class="rot" value="1^2^3">numbers</span>


<script>
function rotateItem()
{ 
 for(j=0;j<$(".rot").get().length;j++)
 {
  valueToRotate = $(".rot:eq("+j+")").attr("value").split("^"); 

  for(i=0;i<valueToRotate.length;i++)
  {
   $(".rot:eq("+j+")").html(valueToRotate[i]);
  }
 }
}
setInterval("rotateItem()",1000)
</script>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

み格子的夏天 2024-10-06 18:27:58

您可以使用 jQuery .data() 方法来存储正在旋转的每个字符的当前索引。此外，.each() 方法可以非常轻松地为 jQuery 结果中的每个元素执行某些功能。

试试这个：

function rotateItem() {
    $('.rot').each(function() { // for each jquery object with class 'rot'
        var values = $(this).attr('value').split('^'); // get value array

        if ($(this).data('activeVal') == null) // if 'activeVal' is not set, set it to a default of 0
            $(this).data('activeVal', 0);
        else // otherwise increment through array indexes
            $(this).data('activeVal', ($(this).data('activeVal') + 1)%values.length); // mod (%) makes sure we loop back when we get to the end

        $(this).html(values[$(this).data('activeVal')]);
    });
}

setInterval(rotateItem,1000);

You can use the jQuery .data() method to store the current index of each character being rotated. Also, the .each() method makes it very easy to perform some function for each element in a jQuery result.

Try this:

function rotateItem() {
    $('.rot').each(function() { // for each jquery object with class 'rot'
        var values = $(this).attr('value').split('^'); // get value array

        if ($(this).data('activeVal') == null) // if 'activeVal' is not set, set it to a default of 0
            $(this).data('activeVal', 0);
        else // otherwise increment through array indexes
            $(this).data('activeVal', ($(this).data('activeVal') + 1)%values.length); // mod (%) makes sure we loop back when we get to the end

        $(this).html(values[$(this).data('activeVal')]);
    });
}

setInterval(rotateItem,1000);

回复收藏 0 原文

~没有更多了~