"change page layout"按钮点击无响应 前端调试求助

你的代码里存在一个大小写错误，这是导致按钮点击无反应的核心原因：
document.getElementbyId 应该写成 document.getElementById（注意Id里的I是大写）。JavaScript对大小写敏感，API名称拼写错误会直接导致代码无法执行。

修正后的完整代码如下：

<!DOCTYPE html>
<html>
<head>
<script>
    function mouseOver () {
        window.alert('Click here to accept cookies!')
    }
    function bannedKey () {
        window.alert('Sorry, that is a banned key. Please try again.')
    }
    function changeLayout(form) {
        document.getElementById("firstname").value = "hi"
    }
</script>
</head>
<body>
    <form>
        <fieldset>
        <b>First Name: </b><input type="text" name="keyjoke" onkeypress="bannedKey()" id="firstname" value=""><br>
        <b>Last Name: </b><input type="text" name="keyjoke" onkeypress="bannedKey()"><br>
        <button onmouseover="mouseOver()">Submit!</button>
        </fieldset><br>
        <input type="button" id="btn1" onclick="changeLayout(this.form)" value="Click here to change the page layout!">
    </form>
</body>
</html>

另外给你个小技巧：遇到这类无响应的问题时，按F12打开浏览器控制台，查看是否有报错信息，这类拼写错误会直接在控制台里提示，能帮你快速定位问题。

内容的提问来源于stack exchange，提问作者Unfinished Comb Studios