Question

我正在尝试创建一个随机gif生成器。设计非常简单，只需要gif / img加载，一旦用户点击/点击它随机化并从阵列中提取另一个随机图像。

现在我想让图像在点击时随机化。

目前只有在刷新页面时才会随机化。

HTML

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="js/rand.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">

<head>
    <title>Gif Generator - Prototype</title>
</head>

<body> 

    <h1>Gif Generator - Prototype</h1>

    <section> 
        <p>This image is random</p>
        <a href="#" class="click">
            <script>
                getRandomImage()
            </script>
        </a>
    </section>



</body>

JS

var randomImage = new Array();

randomImage[0] = "images/100.jpg";
randomImage[1] = "images/200.jpg";
randomImage[2] = "images/300.jpg";
randomImage[3] = "images/400.jpg";


function getRandomImage() { 
var number = Math.floor(Math.random()*randomImage.length);
document.write('<img src="'+randomImage[number]+'" />');
}

Answer 1

根据您在顶部的jQuery参考，下面是建议的解决方案：

$(function() {
    $('a.click').click(function(e) {
        e.preventDefault();
        var number = Math.floor(Math.random()*randomImage.length);
        $(this).html('<img src="'+randomImage[number]+'" />');
    });
});

Answer 2

点击方法上的

用于此目的。在<img>代码中，您可以添加onclick方法

<img src="" alt="Random image" onclick="getRandomImage()">

点击后如何随机化图像？

2 个答案: