JavaScript 中的高级事件处理

xiaobian

New Document
    window.onload = function(){
        if(document.addEventListener){
            document.body.addEventListener("mousedown",handleKeyDownBody,false);   
            document.getElementById("event").addEventListener("mousedown",handleKeyDownDiv,false);
        }else if(document.attachEvent){
            document.body.attachEvent("onmousedown",handleKeyDownBody);
            document.getElementById("event").attachEvent("onmousedown",handleKeyDownDiv);
        }
    }
    function handleKeyDownBody(){
        console.info("mouse down on body");
    }
    function handleKeyDownDiv(event){
        if(event.preventDefault){
            event.preventDefault();
        }else {
            event.returnValue = false;
        }
        if(document.addEventListener){
            event.cancelBubble = true;
        }
        else if(document.attachEvent){
            event.stopPropagation();
        }
   
        console.info("mouse down on div");
        
    }
    function handleKeyDownParentDiv(){
        console.info("mouse down on parent div");
    }
    Event  
[分享]Ajax与php静态缓存结合和Tip体验!
        好
像没分享一点技术上的东西了，老觉得有所亏欠，今天中午没事的时候就在构思SaI的首页模式。突然想到类似HS方似的全文静态.如果是全文静态的话，就
需要一个略文tip了。看到过很酷的tip，好像在dreamweaverMX那个年代很流行一种open出来的div无边窗体，不过那时都是用插件来使
用，那时我还是个不入流的设计者。今天，我尝试了用javascript+php的静态模式进行tip制作，小有成就，给大家分享一下，还有附件提供下
载.
       
HTML+CSS+javascript部分.// tip.html

Ajax-Tip
    function tip(event,tid){
        var dMessage = document.getElementById('message');
        if(dMessage){
                dMessage.style.display='block';               
        }else{        
            var message = document.createElement('div');
                message.className='message';
                message.name='message';
                message.id    ='message';
                message.style.position = 'absolute';
                document.body.appendChild(message);
            var dMessage = document.getElementById('message');
                dMessage.innerHTML='mouse X:'+event.clientX+'
'+'mouse Y:'+event.clientY;
        }
        
        //监听
        if(document.addEventListener){
            document.addEventListener("mousemove",moveHandler,true);
        }else if(document.attachEvent){
            document.attachEvent("onmousemove",moveHandler);
        }
        
        //让其他元素不可见
        if(event.stopPropagation) event.stopPropagation();
        else event.cancelBubble = true;
        
        //关闭默认动作
        if(event.preventDefault) event.preventDefault();
        else event.returnValue = false;
        
        function moveHandler(e){
            if(!e) e = window.event;
            
            if(e.clientX+320'
    }
   
    function hiddenTip(){
        var dMessage = document.getElementById('message');
        dMessage.style.display='none';
    }
  
   
第一个Tip
    第二个Tip
  

总结，这里有几个要点。分别要说明一下。

IE没有监听模式的2级DOM，所以应用的方法就是将事件的处理程序的起泡属性关才，"来模拟一种监听" (个人理解).

filter:是IE特有的透明滤镜...    -moz-opacity:FF特有的透明滤镜    opacity:OP特有的透明滤镜，真是百花齐放，为了学习css的朋友，你们辛苦了。
这
是tip.php的静态调用文件的内容，相比主程序，这个简单得多了。Ajax讲的是无刷新,可是我用的方法有刷新，只是肉眼无法看得见。我在div层里
用了动态的src就意味着iframe里的内容会刷,以后再想一个好的办法，解决，如果哪位大大，有更好的办法，麻烦，教教。











本文来自ChinaUnix博客，如果查看原文请点：http://blog.chinaunix.net/u/23783/showart_262212.html