黑马程序员技术交流社区

标题: 学习DOM的时候出的意外~~~~求助~~ [打印本页]
作者: 李后量    时间: 2012-9-15 18:03
标题: 学习DOM的时候出的意外~~~~求助~~
本帖最后由 李后量 于 2012-9-16 16:24 编辑

先上代码：
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3.     <title>getElementByTagName</title>
  4.         <script type="text/javascript">
  5.             function initEvent() {
  6.                 var inputs = document.getElementsByTagName("input");
  7.                 for (var i = 0; i < inputs.length; i++) {
  8.                     var input = inputs[i];
  9.                     input.onClick = btnClick;
  10.                 }
  11.             }
  12.             function btnClick() {
  13.                 var inputs = document.getElementsByTagName("input");
  14.                 for (var i = 0; i < inputs.length; i++) {
  15.                     var input = inputs[i];
  16.                     if (input == window.event.srcElement) {
  17.                         input.value = "呜呜";
  18.                     }
  19.                     else {
  20.                         input.value = "哈哈";
  21.                     }
  22.                 }
  23.             }
  24.         </script>
  25. </head>
  26. <body onload="initEvent()">
  27.     <input type="button" value="哈哈"/>
  28.     <input type="button" value="哈哈"/>
  29.     <input type="button" value="哈哈"/>
  30.     <input type="button" value="哈哈"/>
  31.     <input type="button" value="哈哈"/>
  32.     <input type="button" value="哈哈"/>
  33. </body>
  34. </html>
复制代码
如果不是我的代码输入有问题的话（但我看了好多遍都觉得没什么错啊），应该会像视频里面那样，单击各个按钮时被点击的那个按钮的value会变成“呜呜”，但我运行的时候却怎么点都没有反应，调试的时候发现在页面加载的时候的确调用了initEvent方法，但当单击的时候却没有调用到onClick方法，这是为什么呢？求解释~~~~~~~
作者: 张青江    时间: 2012-9-15 18:10
你是用的document.getElementsByTagName ，但是你的按钮少了个Name属性，怎么会成功？
作者: 维纳斯之叶    时间: 2012-9-15 21:31
我看了n遍你的代码，和我写的一模一样呢，，我的能出来的，代码应该没错的啊，你重新启动VS，在调试一下，看看对吗？
作者: 李后量    时间: 2012-9-16 12:03
维纳斯之叶 发表于 2012-9-15 21:31
我看了n遍你的代码，和我写的一模一样呢，，我的能出来的，代码应该没错的啊，你重新启动VS，在调试一下， ...

我也觉得代码没问题啊，但就是运行不成功，重启了VS还是不行，点击了按钮之后没反应
作者: 李后量    时间: 2012-9-16 12:05
张青江 发表于 2012-9-15 18:10
你是用的document.getElementsByTagName ，但是你的按钮少了个Name属性，怎么会成功？ ...

getElementsByTagName貌似是通过标签来获取对象而不是通过name来获取对象吧
作者: 王荟越    时间: 2012-9-16 14:25
还真没看出错，你把js代码换成这个试试
<script type="text/javascript">
        function iniEvent() {
            var inputs = document.getElementsByTagName("input");
            for (var i = 0; i < inputs.length; i++) {
                var input = inputs[i];
                input.onclick = btnClick;
            }
        }
        function btnClick() {
            var inputs = document.getElementsByTagName("input");
            for (var i = 0; i < inputs.length; i++) {
                var input = inputs[i];
                if (input == window.event.srcElement) {
                    input.value = "呜呜";
                }
            }
        }
</script>
作者: 维纳斯之叶    时间: 2012-9-16 15:56
(⊙o⊙)…，原来就是一个字母大小写的问题
09.                    input.onClick = btnClick;onclick应该是小写，C不应该大写~~~~，，细节决定成败啊~~~~

作者: 李后量    时间: 2012-9-16 16:19
维纳斯之叶 发表于 2012-9-16 15:56
(⊙o⊙)…，原来就是一个字母大小写的问题
09.                    input.onClick = btnClick;onclick应该 ...

我一开始的时候就改了啊，但还是不行，你的行了？？那为什么我的不行呢
作者: 李后量    时间: 2012-9-16 16:23
维纳斯之叶 发表于 2012-9-16 15:56
(⊙o⊙)…，原来就是一个字母大小写的问题
09.                    input.onClick = btnClick;onclick应该 ...

刚才又试了一次，结果就OK了，奇怪哦，难道我一开始的时候写错了？？不过这倒是给我一次深刻的印象哦，谢谢~~谢谢~~~
作者: 梁健1    时间: 2012-9-16 16:52
你的onclick写成onClick了。。。。
作者: 维纳斯之叶    时间: 2012-9-16 21:56
李后量 发表于 2012-9-16 16:23
刚才又试了一次，结果就OK了，奇怪哦，难道我一开始的时候写错了？？不过这倒是给我一次深刻的印象哦，谢 ...

共勉共勉啊~~~嘿嘿
作者: 郎乐乐    时间: 2012-9-16 22:59
最好把 input.onclick = btnClick;给为input.setAttribute("onclick", btnClick);
因为上面那个是旧的规范好多浏览器可能对它的支持不好才会造成灵异事件



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2