随鼠标随意更改数组文本？

我有一个非常简单但令人沮丧的问题。基本上我想要做的是当你MouseIn &在一个特定的元素，然后一个元素文本将随机更改一个数组。继承人我的代码，开始与HTML：随鼠标随意更改数组文本？

<div class="logo"> 
    <a href="#"> 
     luke <span>whitehouse</span> 
    </a> 
    <span class="logo-note">// front-end web designer</span> 
</div>

而且继承人的JS：

$(document).ready(function() { 
    var quotes = new Array("foo", "bar", "baz", "chuck"); 
    var randno = Math.floor (Math.random() * quotes.length); 
    $('.quote').add(quotes[randno]); 

    $('.logo a').mouseover(function() { 
     $('.logo-note').text(quotes[randno]); 
    }).mouseout(function() { 
     $('.logo-note').text(quotes[randno]); 
    }); 
});

来源

2012-11-01 Luke Whitehouse

您需要的时候将鼠标放在输入/输出事件发生时获得随机文本。在你的代码中，randno计算一次，永远不会改变，所以你每次都会得到相同的数组元素。试试这个想法

$('.logo a').mouseover(function() { 
     $('.logo-note').text(quotes[Math.floor (Math.random() * quotes.length)]); 
    }).mouseout(function() { 
     $('.logo-note').text(quotes[Math.floor (Math.random() * quotes.length)]); 
    });

来源

2012-11-01 01:11:25 Satyajit

嗨Satyajit，谢谢你的回应。这确实解决了大部分问题，但现在唯一的问题是，如果选择器中存在任何子标记（在本例中为“.logo a”，但是我已经更改了某些部分，现在只是“.logo”），那么脚本再次运行并找到一个新的数组编号，有没有办法阻止这种情况？ –

您可以更详细地解释一下吗？也许显示您的新HTML以及需求如何改变。听起来像某些您不想要的元素一个随机文本 - 是吗？ – Satyajit

嗨，老兄，我为你创建了一个codepen。基本上，当你将鼠标悬停在.logo上时，它可以正常工作，但是当你将鼠标悬停在这个'a'标签中的嵌套元素上时，它再次运行脚本。 http://codepen.io/anon/pen/ovaHg –

随鼠标随意更改数组文本？

回答

相关问题