关于如何控制js事件绑定执行顺序的问题？

我们知道js绑定事件用attachEvent和addEventListener；
这两种方式都可以给一个事件绑定多个处理函数，但处理函数是按绑定顺序倒序执行的，而且有添加和删除事件处理函数的方法，就是没有找到获取事件处理函数的方法。
如何控制或修改绑定事件的执行顺序，让后绑定的最后执行，或按特定的顺序执行<script type="text/javascript">
 function addEvent( obj, type, fn ) {
 if ( obj.attachEvent ) {
 obj["e"+type+fn] = fn;
 obj[type+fn] = function(){obj"e"+type+fn;}
 obj.attachEvent("on"+type, obj[type+fn] );
 } else
 obj.addEventListener( type, fn, false );
 }
 window.onload = function(){
 var test = document.getElementById("test");addEvent(test,"click",function(){
 alert(1);
 });
 addEvent(test,"click",function(){
 alert(2);
 });
 addEvent(test,"click",function(){
 alert(3);
 });
 addEvent(test,"click",function(){
 alert(4);
 });
 }
</script>
<h1 id="test">javascript事件绑定（点我）</h1>
IE与非IE浏览器在事件绑定的执行顺序相反 有什么办法解决呢

解决方案 »

  1.   

    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
        <script type="text/javascript">
        function addEvent( obj, type, fn ) {
            if ( obj.attachEvent ) {
                obj.attachEvent("on"+type, fn );
            } else{
                obj.addEventListener( type, fn, false );
            }
        }
        window.onload = function(){
            var test = document.getElementById("test");
            if( test.attachEvent ){
                addEvent(test,"click",function(){
                    alert(4);
                });
                addEvent(test,"click",function(){
                    alert(3);
                });
                addEvent(test,"click",function(){
                    alert(2);
                });
                addEvent(test,"click",function(){
                    alert(1);
                });
            }else{
                addEvent(test,"click",function(){
                    alert(1);
                });
                addEvent(test,"click",function(){
                    alert(2);
                });
                addEvent(test,"click",function(){
                    alert(3);
                });
                addEvent(test,"click",function(){
                    alert(4);
                });
            }
        }
        </script>
    </head>
    <body>
        <h1 id="test">javascript事件绑定（点我）</h1>
    </body>
    </html>
    改了一下，　至少表面上能达到楼主的要求了，　呵呵。
      

  2.   

    上面是纯js的写法，不过复杂的同一事件的绑定，建议还是用jQuery，如下写法可以很轻松地完成多次绑定，在多个浏览器(IE/Firefox)中效果均一致。而且解除其中某一事件，　也很轻松，　详见本人博客：
    http://blog.csdn.net/yenange/article/details/7660982<!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function(){
                $("#test").bind("click.t1",function(){
                    alert("1");
                });
                $("#test").bind("click.t2",function(){
                    alert("2");
                });
                $("#test").bind("click.t3",function(){
                    alert("3");
                });
                $("#test").bind("click.t4",function(){
                    alert("4");
                });
            });
        </script>
    </head>
    <body>
        <h1 id="test">javascript事件绑定（点我）</h1>
    </body>
    </html>