一个段简单的js代码，一直提示变量没有定义

发布于
2017-01-11

想做一个点击按钮后，一段文字出现在屏幕上，刚刚开始学js，
console里一直提示 pickme is not defined。

    <html>
    
    <head>
        <title>测试</title>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <script type="text/javascript">
         window.onload = function() {
            function pickme() {
                var pickup = document.getElementById('pickup');
                var textbox =document.getElementById('textbox');
                textbox.innerHTML="你点击了按钮";
            }
        }
        </script>
    </head>
    <body>
        <div style="background-color: #dddddd;height:400px;">
        </div>
        <div id="textbox" style="height: 200px;">
            <button id="pickup" onclick="pickme()" type="button" style="margin: 15px;width: 100px;height:50px;">按钮</button>
        </div>
    </body>
    
    </html>

javascript

阅读 3.8k

5 个回答

得票最新

AllenAuYeung

2941310

发布于
2017-01-11

✓ 已被采纳

原因如楼上所说。
若担心文档未加载完，用户触发事件，可以这样：

<script type="text/javascript">
window.onload = function() {
    function pickme() {
        var pickup = document.getElementById('pickup');
        var textbox =document.getElementById('textbox');
        textbox.innerHTML="你点击了按钮";
    }
    document.getElementById('pickup').addEventListener('click',pickme)
}
</script>

另为避免脚本影响文档渲染，不是必须放在前面的，建议放到文档后面，即 </body> 之前。

shawumu

39527

发布于
2017-01-11

你的pickme函数定义在了window.onload函数内部，所以button的onclick是拿不到的，改成全局的就可以了

<script type="text/javascript">
         function pickme() {
                var pickup = document.getElementById('pickup');
                var textbox =document.getElementById('textbox');
                textbox.innerHTML="你点击了按钮";
            }
</script>

lees0839

2542922

发布于
2017-01-11

把window.onload 去掉就可以了

placeless

197412

发布于
2017-01-11

对于楼主的问题，去掉window.onload即可,
因为这个pickup方法定义的作用域不是全局的，是访问不到了。