Question

所以我正在建立一个基于星球大战的RPG。在游戏的第一部分，我试图让用户选择一个侧面（反叛者/帝国）来扮演。我有两个div，其中包含每个侧面标识的图像。因此，例如，如果用户点击帝国徽标，他们将扮演帝国。如果我用JavaScript制作士兵原型，如果用户点击某个div /图像，我将如何更新士兵对象中的属性？我收到的唯一建议是在jQuery中更容易做到吗？我似乎无法弄明白，但这就是我所拥有的：

ExpectedExceptions

Answer 1

您可以按如下方式创建一个对象来存储玩家的，在这种情况下是士兵的属性。

e.g。

var soldier = {

}

然后你可以说：

function chooseSide(side) {
    soldier["side"] = side;
}

士兵对象看起来像：

{
    side: "rebels/empire"
}

稍后在您的代码中，您可以通过以下方式访问士兵：

console.log(soldier.side);
// Obviously this is just a print to the console, but you can anything with it

**此外，正如评论中所述，当您在onclick事件中调用该函数时，您需要传递一些值，例如“反叛者”。我也没有看到你需要士兵的功能。

**这只会创建一名士兵的实例。

Answer 2

你可以这样做。

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
    <script type="text/javascript">

         var soldier = {
            "side" : ""
         }

        function chooseSide(object){
            var alt = object.childNodes[1].alt
            soldier.side = alt;
        }

    </script>
</head>
<body>
<h2>Choose Your Side</h2>
<div class="rebels">
<div onclick="chooseSide(this)" style="background-color: red; height: 20px;">
    <img id="logo" src="../img/rebels.jpg" alt="Rebels" height="320" width="380"/>
</div>
</div>

<div class="empire">
<div onclick="chooseSide(this)" style="background-color: blue; height: 20px;">
    <img id="logo" src="../img/empire.jpg" alt="Empire" height="300" width="300"/>
</div>
</div>

</body>
</html>

使用HTML更新JavaScript对象

2 个答案: