gpt4 book ai didi

javascript - javascript : swapping technique, 添加随机文本

转载 作者:行者123 更新时间:2023-11-28 00:28:58 24 4
gpt4 key购买 nike

在我的代码中,每次我用鼠标单击该图像时,该图像都会交换到另一张图像。我在向第二个(交换的)图像添加随机文本时遇到困难。当我看到第一张图片时,文本不应出现。这是我的代码。当我尝试为随机文本编写代码时,java脚本中出现了一些错误。请帮我改正。

<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<h1></h1>
<div id="cookie" class='whole'></div>
</div>
<p id="demo"></p>
<script src="js/cookies.js"></script>
</body>
</html>

js代码:

var lock = document.getElementById('cookie');
var state = 'orange';

function swapImage(){

if (state === 'orange'){
lock.className = 'cracked';
state = 'blue';
}else{
lock.className = 'whole';
state = 'orange';
}
}

lock.addEventListener('click', swapImage, false);

var r_text = new Array ();
r_text[0] = "All the leaves are brown";
r_text[1] = "And the sky is grey";
r_text[3] = "On a winter's day";
r_text[4] = "I'd be safe and warm";
r_text[6] = "California dreaming, On such a winter's day";
var i = Math.floor(7*Math.random())

function fortune() {

document.write(r_text[i]);

}
var elText = document.getElementById('cookies');
elText.addEventListener('click', fortune, false);

CSS:

  #cookie{
width: 360px;
height: 216px;
margin: 100px auto;
margin-top: 10px;
}

.whole {
background: url("../images/whole.png");
}
.cracked {
background: url("../images/cracked.png");
}

最佳答案

您必须在 fortune 函数中运行 var i = Math.floor(7*Math.random()) ,或者 i将会和以前一样。

关于javascript - javascript : swapping technique, 添加随机文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29201480/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com