                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /DOM事件探秘

无法弹出alert，请帮忙看下是怎么回事，自己怎么也找不到问题点，谢谢了

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>跨浏览器事件处理</title>

<script type="text/javascript">
var eventUtil = {
            // 添加句柄
            addHandler:function(element,type,handler){
                if(element.addEventListener){
                    element.addEventListener(type,handler,false);
                }else if(element.attachEvent){
                    element.attachEvent('on'+type,handler);
                }else{
                    element['on'+type]=handler;
                }
            },
            // 删除句柄
            removeHandler:function(element,type,handler){
                if(element.removeEventListener){
                    element.removeEventListener(type,handler,false);
                }else if(element.detachEvent){
                    element.detachEvent('on'+type,handler);
                }else{
                    element['on'+type]=null;
                }
            }
        }
        function showMes(){
            alert("跨浏览器的click事件");
        }
        var btn5=document.getElementById("btn");
        eventUtil.addHandler(btn,'click',showMes);
</script>
</head>
<body>
<div>
<input type="button" id="btn" value="按钮" >
</div>
</body>
</html>

myrtis

2015-09-15

源自：DOM事件探秘 2-4

关注问题我要回答

970

操作

收起

1 回答

pardon110
2015-09-15

存在两个错误,第一个js必须在整个文档加载完毕才能执行，如果要写在头部，请用window.onload=function(){}

第二个错误：完全是拼写错误你的代码出现了btn5,当然关键是第一个错误，是致命的。所以你应该这样写

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>跨浏览器事件处理</title>
 <script type="text/javascript">
window.onload = function(){
var eventUtil = {
            // 添加句柄
            addHandler:function(element,type,handler){
                if(element.addEventListener){
                    element.addEventListener(type,handler,false);
                }else if(element.attachEvent){
                    element.attachEvent('on'+type,handler);
                }else{
                    element['on'+type]=handler;
                }
            },
            // 删除句柄
            removeHandler:function(element,type,handler){
                if(element.removeEventListener){
                    element.removeEventListener(type,handler,false);
                }else if(element.detachEvent){
                    element.detachEvent('on'+type,handler);
                }else{
                    element['on'+type]=null;
                }
            }
        }
        function showMes(){
            alert("跨浏览器的click事件");
        }
        var btn=document.getElementById("btn");
        eventUtil.addHandler(btn,'click',showMes);
}
</script>

</head>
<body>
<div>
<input type="button" id="btn" value="按钮" >
</div>
</body>
</html>

或者这样

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>跨浏览器事件处理</title>
</head>
<body>
<div>
<input type="button" id="btn" value="按钮" >
</div>

<script type="text/javascript">
var eventUtil = {
            // 添加句柄
            addHandler:function(element,type,handler){
                if(element.addEventListener){
                    element.addEventListener(type,handler,false);
                }else if(element.attachEvent){
                    element.attachEvent('on'+type,handler);
                }else{
                    element['on'+type]=handler;
                }
            },
            // 删除句柄
            removeHandler:function(element,type,handler){
                if(element.removeEventListener){
                    element.removeEventListener(type,handler,false);
                }else if(element.detachEvent){
                    element.detachEvent('on'+type,handler);
                }else{
                    element['on'+type]=null;
                }
            }
        }
        function showMes(){
            alert("跨浏览器的click事件");
        }
        var btn=document.getElementById("btn");
        eventUtil.addHandler(btn,'click',showMes);
</script>
</body>
</html>

0 回复有任何疑惑可以回复我~

收起回答

myrtis 提问者

太感动，这如鲠在喉的问题终于被你解决了！

2015-09-15 回复有任何疑惑可以回复我~

0/150

提交

取消

DOM事件探秘

参与学习 99545 人
解答问题 1197 个

DOM事件？本课程会通过实例来给小伙伴们讲解如何使用这些事件

进入课程

本课相似问答

1 回答能不能帮我看看哪边出问题了无法弹出alert警告

4 回答帮忙看看什么问题，为什么不会弹出

3 回答回车怎么弹出下拉框？？？

2 回答为什么点击click3不能弹出alert？？？？

2 回答出现滚动条了是怎么回事？

搜索更多本课相关问答

无法弹出alert，请帮忙看下是怎么回事，自己怎么也找不到问题点，谢谢了

我要回答关注问题

热搜

最近搜索清空

无法弹出alert，请帮忙看下是怎么回事，自己怎么也找不到问题点，谢谢了

1 回答

本课相似问答

无法弹出alert，请帮忙看下是怎么回事，自己怎么也找不到问题点，谢谢了