我这个简单的原生js中Button的onclick事件为什么不响应?

没有window.onload事件,为什么Button的onclick事件就不响应?如下:
<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script>
        //      window.onload=function(){
        document.getElementById("button1").onclick = function() {
                alert("点击成功");
            }
        //          }
    </script>
</head>

<body>
    <input type="button" value="点击跳转" id="button1" />
</body>

10个回答

js脚本解释时,元素button1还没有加载出来,因此事件实际没用绑定上。你可以实际绑定放到这里。

 window.onload=function(){

 }

或者不用这个的话,你可以把整个标签挪到元素后面,例如常见的做法是把内嵌js放到body的最后。<br> 像这样:</p> <pre><code> &lt;head&gt; &lt;meta charset=&quot;UTF-8&quot;&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;input type=&quot;button&quot; value=&quot;点击跳转&quot; id=&quot;button1&quot; /&gt; &lt;script&gt; document.getElementById(&quot;button1&quot;).onclick = function() { alert(&quot;点击成功&quot;); } &lt;/script&gt; &lt;/body&gt; </code></pre>

上面的回答没编辑好,不好意思。重新打一次。

js脚本解释时,元素button1还没有加载出来,因此事件实际没用绑定上。你可以实际绑定放到这里。

  window.onload=function(){

 }

或者不用这个的话,你可以把整个标签挪到元素后面,例如常见的做法是把内嵌js放到body的最后。 像这样:

 <head>
   <meta charset="UTF-8">
   <title></title>
</head>

<body>
   <input type="button" value="点击跳转" id="button1" />
   <script>
       document.getElementById("button1").onclick = function() {
               alert("点击成功");
       }
   </script>
</body>

你应该把JS代码放在button元素之后,因为你这个页面元素在执行的时候为null。你按我说的试试

恩,js的函数预解析。
我好像这块也不清楚,回去复习一下

你应该好好了解一下window.onload再来提问

js标签最好在body末尾处添加,你这样html元素没有加载完毕就执行js逻辑是不行的

你这样写不太可行 把js写后边 html的写前边 原因就不多说了 楼上都说完了

点击事件属于DOM事件,需要页面加载完成,默认情况下浏览器解析完所有的DOM结构才能执行,也可以使用页面加载事件,提前生效

        document.getElementById("button1").on('click ',function() {
               alert("点击成功");
       })
yk8023
我在想名字 试了一下不行 on() 是jQuery的,原生js不能用
大约 2 年之前 回复

谢谢各位了!解决问题了!

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问