Question

我有一个容器，其中包含用户可以悬停的几个图标，并在其旁边显示一个文本块。我从数组中抓取文本块并具有随机函数，以便在重新访问页面时它们始终显示不同的文本块。

我遇到了一个问题，每当你将鼠标悬停在一个图标上时，它会不断添加更多数组元素，因为每次将鼠标悬停在图标上时都会调用该函数。所以我决定使用one（）方法，因此该函数只运行一次，但那是我的真正的问题。使用one（）方法不会显示任何文本，而且由于我的嵌套函数，我很确定它。

您可以在此处对此进行测试：http://www.evanvolmering.com/bootstrap/docs/examples/carousel/eyeswideshut.html

在横幅中，视频将播放，不久之后，横幅左下方会出现一个小图标。将鼠标悬停在它上方会显示一些文字。当您将鼠标悬停在它上面时，它会添加另一个数组项，依此类推。它有效，但我不希望它继续添加数组项。

10秒后，右上方会出现另一个图标，该图标当前已应用了one（）方法。你可以看到当你将鼠标悬停在它上面时没有任何反应。不知道从哪里开始。

我的随机代码（我从另一个StackOverflow答案获得）：

var numRandoms = 14;
function makeUniqueRandom() {
   if (!uniqueRandoms.length) {
      for (var i = 0; i < numRandoms; i++) {
         uniqueRandoms.push(i);
      }
   }
   var index = Math.floor(Math.random() * uniqueRandoms.length);
   var val = uniqueRandoms[index];
   uniqueRandoms.splice(index, 1);
   return val;
}

我目前正在使用的代码＆＃39;但是在悬停时不断添加更多数组项：

     $('img.button1').hover(function(){
     $('p.trivia1').fadeIn("slow");
     $( 'p.trivia1' ).append(makeUniqueRandom());
},
    function(){
    $("p.trivia1").stop().fadeOut("slow");
});

我的代码使用了一个（）但在悬停时没有做任何事情：

    $('img.button2').one("hover",function(){
         $('p.trivia2').fadeIn("slow");
    $( 'p.trivia2' ).append(makeUniqueRandom());
},
    function(){
    $("p.trivia2").stop().fadeOut("slow");
});

Answer 1

使用mouseenter / mouseleave代替悬停

undefined

jQuery .one（）方法

1 个答案: