好吧，我想做的是使用 jQuery 制作一个石头剪刀布类型的游戏。
我需要它如何工作如下。
选择一张触发 .click 功能的图片(单击它)(我假设这就是我将使用的)，然后让计算机创建一个 1 到 5 之间的随机数。然后，这 5 个数字将分别对应于一个不同的画面。 (即 1-石头、2 布、3 剪刀、4 蜥蜴、5 史波克)。我认为应该有一个 if/else 语句设置来实现它，所以它会是这样的: 如果计算机选择1 如果你选择摇滚，领带 否则，如果你选择纸质，你就输了 否则如果你选择剪刀，你就赢了 否则如果你选择斯波克，你就赢了 否则如果你选择蜥蜴你就输了 否则如果计算机选择2 等等等等等等
问题是我以前从未学过如何对图片进行输入，其次，如何进行 rng，以便我可以与计算机进行对战。
所以不用说我的代码非常简单，因为我没有一个可以跳的起点
Html 仅显示图片和标题 atm。 JSfiddle 的值(value) - http://jsfiddle.net/nndq3nnz/
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="styles.css" rel="stylesheet" type="text/css" media="screen">
</head>
<body>
<div id="wrapper">
<h1>Lizard, paper, scissors, spock, rock</h1>
<div id="images">
<img src="Images/lizard.jpg" width="150" height="150" alt=""/>
<img src="Images/paper.jpg" width="150" height="150" alt=""/>
<img src="Images/scissors.jpg" width="150" height="150" alt=""/>
<img src="Images/spock.jpg" width="150" height="150" alt=""/>
<img src="Images/rock.jpg" width="150" height="150" alt=""/>
<div id="comp">
</div>
<div id="win">
</div>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="unit2.js"></script>
</body>
</html>
和 JavaScript:
$(function(){
$('#play').click(function(){
});//closes play function
});// closes function
我确实卡在了开头，因为我不知道如何启动 rng 或图像点击。如果我使用图片下方的按钮和单选按钮来选择它们，这将是 np，但我不能。
提前致谢。
最佳答案
您可以在图像上使用 JQuery 的 .click() 方法，没有问题。
但是，您也可以将图像包装在按钮内，以便可以向它们添加值，然后使用单击 Controller 检索按下的按钮的值。
这就是您执行该特定操作的方式:
<button class="game-button" value="1"><img src="Images/lizard.jpg" width="150" height="150" alt=""/></button>
<button class="game-button" value="2"><img src="Images/paper.jpg" width="150" height="150" alt=""/></button>
<button class="game-button" value="3"><img src="Images/scissors.jpg" width="150" height="150" alt=""/></button>
<button class="game-button" value="4"><img src="Images/spock.jpg" width="150" height="150" alt=""/></button>
<button class="game-button" value="5"><img src="Images/rock.jpg" width="150" height="150" alt=""/></button>
还有一些 JS:
$(document).on('click', '.game-button', function(event) {
var value = event.target.val();
// Then pick the computer's choice and run the game.
})
编辑:
如果您无法使用按钮，那么您仍然可以向图像添加一些 data-* 属性来携带该值，并将点击监听器放在图像上。
这就是这样做的方法:
<img class="game-image" src="Images/lizard.jpg" width="150" height="150" alt="" data-value="1"/>
<img class="game-image" src="Images/paper.jpg" width="150" height="150" alt="" data-value="2"/>
<img class="game-image" src="Images/scissors.jpg" width="150" height="150" alt="" data-value="3"/>
<img class="game-image" src="Images/spock.jpg" width="150" height="150" alt="" data-value="4"/>
<img class="game-image" src="Images/rock.jpg" width="150" height="150" alt="" data-value="5"/>
还有一些 JS:
$(document).on('click', '.game-image', function(event) {
var value = event.target.data('value');
// Then pick the computer's choice and run the game.
})
关于javascript - 如何使用图片作为 if/else 语句的激活，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26724993/