1

我使用我在这个线程上找到的一些关于随机 div的代码来创建一组 3 个 Facebook Like 按钮，这些按钮应该在页面加载时随机显示。

问题是，它在 jFiddle 中运行良好，但每当我将它投入生产时就完全失败了。

我从 Nick Craver 那里借用了这段代码并做了一些非常基本的修改，基本上只是将类名从“Image”更改为“facebookLike”：

HTML：

<div class="facebookLike">
    <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fcsuvolleyball&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=150920871613500" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowTransparency="true"></iframe>
</div>
<div class="facebookLike">
    <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fcsurams&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=150920871613500" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowTransparency="true"></iframe>
</div>
<div class="facebookLike">
    <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2FCoachJimMcElwain&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=150920871613500" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowTransparency="true"></iframe>
</div>​

jQuery代码：

var divs = $("div.facebookLike").get().sort(function() {
    return Math.round(Math.random()) - 0.5; //random so we get the right +/- combo
}).slice(0, 1)
$(divs).appendTo(divs[0].parentNode).show();​

这是该页面的链接：http://www.csurams.com/test/facebook.html如您所见，什么都没有发生。

我不知道问题是否与显示有关：无；样式规则或其他东西。但是，当我删除 display:none; 所有三个 div 都显示...

非常感谢任何帮助，现在我的头在我的桌子上敲了一段时间:-)

4

2 回答 2

0

由于只有 3 个元素，因此对其进行排序不会做太多事情。尝试做这样的事情：

var rand = $(".facebookLike").length-1 //need to -1 because :eq is zero indexed
$(".facebookLike:eq("+rand+")").show()
于 2012-11-05T21:48:10.390 回答
0

首先，你不应该使用 jQuery 1.3，现在是 1.8.2？

其次，你没有包装你的代码：

<script type="text/javascript">
    $(function() {
        var divs = $("div.Image").get().sort(function(){ 
            return Math.round(Math.random())-0.5;
        }).slice(0,1);
        $(divs).appendTo(divs[0].parentNode).show();​
    });
</script>

还要注意最后的奇怪字符，你必须删除它们，因为它们在你的代码中也是如此，当你从 jsFiddle 复制东西时，它们有时会像这样，我会将字符保留在那里以便你看到它们.

于 2012-11-05T21:55:12.453 回答