0

我正在尝试通过 jQuery 函数发送一个数组，并让它为数组中的每个单词设置动画。

var foo = [];

foo[0]= "test1";
foo[1]= "test2";
foo[2]= "test3";

$(document).ready(function(){

  $(".ansy").click(function(){ 

    $.each(foo,function(){

      $('.message').animate({'opacity': 0}, 2000, function () {
        $(this).text("enter text or variable here");
      }).animate({'opacity': 1}, 2000);

    });
  }); 

});

我正在使用从stackoverflow上另一个地方获得的代码块，当我将“在此处输入文本或变量”替换为我想要但无法通过数组的任何文本时，该代码块可以工作。我一直在尝试使用 $.each 函数，但我无法让它工作。这个想法是让一个字符串淡入然后淡出，然后让数组中的下一个字符串淡入，依此类推，直到它到达数组的末尾。任何帮助都会很棒。

4

3 回答 3

0

首先，将语言结构包装array在一个 jQuery 对象中，以便获得 jQuery 对象的方法：

$(foo)

然后.each在你的新 jQuery 上使用array：

$(foo).each(function(

确保您的函数正在传递index和value参数：

$(foo).each(function( i, v ){});

然后做你的动画：

$( foo ).each(function( i, v ){
    $('.message')
        .animate({
            'opacity': 0
            },
            2000,
            function(){
                $(this).text(v);
            }
        )
        .animate({
            'opacity': 1
            },
            2000
        );
});

注意我用作v文本值。

被警告，.text()做.html()不同的事情。人们通常想要.html()，除非他们有一个非常具体的理由来使用.text(). 请记住这一点，以防您遇到任何问题。

于 2012-08-19T05:46:43.053 回答
0

这可能是您正在寻找的： 

var foo = [];

    foo[0]= "test1";
    foo[1]= "test2";
    foo[2]= "test3";

    $(document).ready(function(){

         $.each(foo,function(){
            var temp = this;
            $('.message').animate({'opacity': 0}, 2000, function () {
            $(this).text(temp);
           }).animate({'opacity': 1}, 2000);
    }); 


    });​

和小提琴

于 2012-08-19T05:40:35.687 回答
0

工作演示

var foo = ["test1", "test2", "test3"]; //add them all to array at same time

$(document).ready( function() {

    $(".ansy").click( function() {

        $.each(foo, function(index, value) {

            $('.message').animate({'opacity': 0}, 2000, function () {

                $(this).text( value );

            }).animate({'opacity': 1}, 2000);
        });
    }); 
});

有关其用法的详细信息，请参阅jQuery 的文档。$.each()

于 2012-08-19T08:16:15.413 回答