Question

我想在鼠标点击时更改图像randomaly。我找到了这个选项：

<SCRIPT LANGUAGE="Javascript">
function banner() { } ; b = new banner() ; n = 0
b[n++]= "<A HREF='index.html'><IMG SRC='images/pic1.jpg'></A>"
b[n++]= "<A HREF='index.html'><IMG SRC='images/pic2.jpg'></A>"
b[n++]= "<A HREF='index.html'><IMG SRC='images/pic3.jpg'></A>"
b[n++]= "<A HREF='index.html'><IMG SRC='images/pic4.jpg'></A>"
i=Math.floor(Math.random() * n) ; 
document.write( b[i] )
</SCRIPT>

此选项工作正常，但我需要“pic1”始终是第一张图片（也是刷新页面时），而且“pic1”也不会是鼠标点击时改变randomaly的其他图片之一。 / p> 谢谢你，特拉维夫

Answer 1

我确实只是为第一张幻灯片始终相同的项目做了这个。

http://jsfiddle.net/4TvVv/2/继续点击更改顺序n以查看第二/第三图像更改。

<button class="randomize">Change Order!</button>

<ul>
    <li class="slide active">
        <img src="http://placehold.it/250x250" />
    </li>
    <li class="slide active">
        <img src="http://placehold.it/350x250" />
    </li>
    <li class="slide active">
        <img src="http://placehold.it/450x250" />
    </li>                
</ul>


$(document).ready(function() {
    // Randomize slides except first
    $('.randomize').click(function(e) {
        $('ul').each(function(){
            var $ul = $(this);
            var $liArr = $ul.children('li:not(:first)');

            // sort array of list items in current ul randomly
            $liArr.sort(function(a,b){
                var temp = parseInt( Math.random()*10 );
                var isOddOrEven = temp%2;
                var isPosOrNeg = temp>5 ? 1 : -1;
                return( isOddOrEven*isPosOrNeg );
            })
            // append list items to ul
            .appendTo($ul);            
        }); 
    });
});

单击按钮，在HTML中随机更改图像

1 个答案: