Question

我有两个功能。第一个函数将用户输入文本框并将其附加到div，然后将其显示在html中。第二个将改变用户的单词并更改单词的背景和颜色，这样单词就会改变单词的颜色和背景。第一个功能正常，第二个功能是我遇到问题的地方。我还没有用jQuery创建一个数组，所以我猜我的语法有问题，因为我的代码运行就像没有第二个函数一样。有什么建议吗？

由于

以下是功能

function listWordsUsed(wordUsed) {
    var userTrials = $('#userGuesses');
    var divisor = $("<div>" + wordUsed + "</div>");
    divisor.hide().appendTo(userTrials).fadeIn(7000);
    return;
} //End of function listWordsUsed(wordUsed) 

function addStyleToAnswers(wordUsed) {
    listWordsUsed(wordUsed);
    theGuess = $("div").toArray();
        for (i=0; i< theGuess.length; i++)
        {
            if (i % 2 == 0)
            {
                $("#userGuesses").addClass("oddGuess");
            } //if (i % 2 = 0)
            else
            {
                $("#userGuesses").addClass("evenGuess");
            } //else
        } //for (i=0; i< wordUsed.length; i++)
} //function addStyleToAnswers(wordUsed)

这是函数的CSS文件

.oddGuesses {
    color: orange;
    background-color: blue;
}

.evenGuesses {
    color: blue;
    background-color:orange;
}

Answer 1

要遍历jquery对象，您可以使用.each() http://api.jquery.com/each/ 像：

function addAnswer (wordUsed) {
  var userTrials = $('#userGuesses');
  var divisor = $('<div class="word">' + wordUsed + '</div>');
  divisor.hide().appendTo(userTrials).fadeIn(7000);
  return;
}

function addStyleToAnswers(wordUsed) {
  $('.word').each(function(index){
    if (index%2 === 0) {
      $(this).addClass('odd')
    } else {
      $(this).addClass('even')
    }
  });
}

addAnswer();
addStyleToAnswers();

但是当你想要设计偶数或奇数元素时，可以在css中执行此操作至少当你不关心IE8时div:nth-child(odd)和div:nth-child(even)

使用Jquery创建一个数组

1 个答案: