Question

我正在开发一款基于文字的游戏，但我很难开始使用它。似乎应该更改fight（）中按钮（btn0 - btn3）的onclick功能的行正在运行这些功能，而不是简单地更改按钮功能。我通过向从未调用的函数添加警报并在游戏启动时看到它们弹出来解决这个问题，但是按钮在点击时无法调用函数。

＆＃13;

var paragraph = document.createElement('p');
var textNode = document.createTextNode("You are accused of cosmic crimes by the GAMARO OF MAGNARAX. How do you plead?");
var gameText = document.getElementById("game");

var btn0 = document.getElementById("btn0"); 
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
var btn3 = document.getElementById("btn3");

var btn0_content = document.createTextNode("GUILTY"); 
var btn1_content = document.createTextNode("INNOCENT");
var btn2_content = document.createTextNode("");
var btn3_content = document.createTextNode("");

function start() {

    document.getElementById("start_button").style.display = "none";

    paragraph.appendChild(textNode);
    gameText.appendChild(paragraph);

    btn0.appendChild(btn0_content);
    btn1.appendChild(btn1_content);
    btn2.appendChild(btn2_content);
    btn3.appendChild(btn3_content);
}

var yourHPElement = document.getElementById("you");
var bossHPElement = document.getElementById("boss");
var yourHP = 100;
var bossHP = 1000;
var dice = Math.floor(Math.random()*10)+1;
var hit = dice;

function fight() {

    btn0_content.textContent = "Attack";
    btn1_content.textContent = "Defend";
    btn2_content.textContent = "Item";
    btn3_content.textContent = "Inspect";

    yourHPElement.textContent = yourHP;
    bossHPElement.textContent = bossHP;

    rollBoss()

    gameText.children[1].textContent = "You are to be executed. You are struck for " + hit + " damage but did not fall.";    

    btn0.onclick = rollYours();
    btn1.onclick = defend();
    btn2.onclick = item();
    btn3.onclick = inspect();
}

function rollBoss() {
    yourHP = yourHP - hit;
    yourHPElement.textContent = yourHP;
}

function rollYours() {
    bossHP = bossHP - hit;
    bossHPElement.textContent = bossHP;
}

function defend() {
    alert("This feature not yet added.");
}

function item() {
    alert("This feature not yet added.");
}

function inspect() {
    alert("This feature not yet added.");
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
	<title>CORRUPTED LAND</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="./corrupted_land.css">
	<link href="https://fonts.googleapis.com/css?family=Russo+One" rel="stylesheet">
	<link href="https://fonts.googleapis.com/css?family=Play" rel="stylesheet">
</head>
<body>
	<h1>CORRUPTED LAND</h1>
	<div id="game">
		<button type="button" id="start_button" onclick="start()">Start Game</button>
	</div>
	<div id="buttons">
		<button type="button" id="btn0" onclick="fight()"></button>
		<button type="button" id="btn1" onclick="fight()"></button>
		<button type="button" id="btn2" onclick="fight()"></button>
		<button type="button" id="btn3" onclick="fight()"></button>
	</div>
	<div id="hp">
		<span id="you"></span>
		<span id="boss"></span>
	</div>
<script src="corrupted_land.js"></script>
</body>
</html>

＆＃13;

Answer 1

通过在onclick声明的末尾添加括号，您将调用它们。

所以

toString(sample_dependency)

需要成为

btn0.onclick = rollYours();

更改按钮.onclick，获得奇怪的结果（初学者）

1 个答案: