relatedTarget方法的介绍--JavaScript/Ajax--编程设计网

=波波日志 > JavaScript/Ajax > relatedTarget方法的介绍=

[转]relatedTarget方法的介绍

-HTML

<!!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>relatedTarget对象介绍</title>
<script type="text/javascript">

!function (bool) {
//兼容FF一些方法
    var html;
    
    if (bool) {
    
        html = window.HTMLElement.prototype;
        
        window.__defineGetter__("event", function () {
        //兼容Event对象
            var o = arguments.callee;
            
            do {
            
                if (o.arguments[0] instanceof Event) return o.arguments[0];
            
            } while (o = o.caller);
            
            return null;
        
        });
        
        Event.prototype.__defineGetter__('fromElement', function () {
            return this.type == 'mouseover' ? this.relatedTarget : this.target;
        });
        
        Event.prototype.__defineGetter__("toElement", function () {
        /*
        这里：
        onmouseover的时候relatedTarget为鼠标离开（onmouseout）的对象
        onmouseout的时候relatedTarget为鼠标当前（onmouseover）的对象
        */
            return this.type == 'mouseout' ? this.relatedTarget : this.target;

        });
        
        html.contains = function (o) {
            return !!(this.compareDocumentPosition(o) & 16);
        };
        
    }

}(/Firefox/.test(window.navigator.userAgent));

window.onload = function () {

    var wc = document.getElementById("ta");
    wc.onmouseover = function () {
        var wc = this, e = window.event;
        if (!wc.contains(e.fromElement)) alert("over");
    };
    
    wc.onmouseout = function () {
        var wc = this, e = window.event;
        if (!wc.contains(e.toElement)) alert("out");
    };
};
</script> 
</head>

<body>

<br>
<br>
<br>
<br>
<br>
<br>

<table id="ta" width="350" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#996633" id="1"> </td>
<td bgcolor="#234633" id="2"><button> Clos</button></td>
<td bgcolor="#0000FF" id="3"> </td>
</tr>
</table>
</body>
</html>



本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/muxrwc/archive/2007/07/31/1718676.aspx

类别：JavaScript/Ajax　作者：转载　日期：2009-06-29　【评论：0】　

上一篇：window.scrollBy()方法使用示例　
下一篇：javascript之XML DOM对象

暂时没有评论！

发表留言

热门博文