0

当我单击按钮时，除非我在 html 中调用该函数，否则什么也不会发生。我正在尝试删除所有内联 javascript。我已经包含了有效的 html 的注释掉部分。在此先感谢您的帮助！

JavaScript：

var welcomeString;
const TEST = 1;

function setWelcomeString() {
    "use strict";
    welcomeString = prompt("Please enter your name: ", "nobody");
}

function writeOutput() {
    "use strict";
    document.getElementById("demo").innerHTML = "Hello, " + welcomeString;
}

function main() {
    "use strict";
    setWelcomeString();
    document.getElementById("sayHi").onclick = writeOutput();
}

main();

HTML：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>**SET TITLE**</title>
        <link href="css/style.css" rel="stylesheet">
        <script src="firstScript.js"></script>
    </head>

    <body>
        <h1 id="wiggles">TEMPLATE</h1>
        <!--<button id="sayHi" onclick="writeOutput()">Say Hi</button>-->
        <button id="sayHi">Say Hi</button>
        <p id="demo"></p>
    </body>
</html>
4

3 回答 3

4

当您将函数分配为事件的处理程序时，您需要分配函数本身，而不是执行函数并像您一样分配它的返回值。改变这个：

document.getElementById("sayHi").onclick = writeOutput(); // parens

对此：

document.getElementById("sayHi").onclick = writeOutput; // no parens

这是一个带有工作示例的jsfiddle 链接。

于 2013-01-25T16:04:46.290 回答
1

你必须在里面添加你的整个代码load，就像这样

window.load = function(){
    // your javascript here
};

此外，正如 jbaby 提到的，使用

document.getElementById("sayHi").onclick = function(){ writeOutput();};

或者

document.getElementById("sayHi").onclick = writeOutput;
于 2013-01-25T16:07:02.190 回答
1

你有两个问题。

第一个被 jbabey 覆盖。

第二个是 firstScript.js 出现在您的按钮之前。当您将onClick处理程序分配给它时，这是有问题的。它在dom中不存在。

尝试将整个主脚本放入其中window.onload = function () { ... }或将其移动到标记的底部。

于 2013-01-25T16:12:09.273 回答