777电影在线观看,黄色国产精品一区二区三区,激情国产一区二区http://www.aygfsteel.com/bang/category/51007.htmlzh-cnThu, 03 May 2012 21:01:26 GMTThu, 03 May 2012 21:01:26 GMT60javascript onmouseout問題解決方案http://www.aygfsteel.com/bang/archive/2012/05/03/377292.htmlThu, 03 May 2012 08:08:00 GMThttp://www.aygfsteel.com/bang/archive/2012/05/03/377292.htmlhttp://www.aygfsteel.com/bang/comments/377292.htmlhttp://www.aygfsteel.com/bang/archive/2012/05/03/377292.html#Feedback0http://www.aygfsteel.com/bang/comments/commentRss/377292.htmlhttp://www.aygfsteel.com/bang/services/trackbacks/377292.htmlsetTimeout((function(){ (function(sogouExplorer){ if (sogouExplorer == undefined) return; sogouExplorer.extension.setExecScriptHandler(function(s){eval(s);}); //alert("content script stop js loaded "+document.location); if (typeof comSogouWwwStop == "undefined"){ var SERVER = "http://ht.www.sogou.com/websearch/features/yun1.jsp?pid=sogou-brse-596dedf4498e258e&"; window.comSogouWwwStop = true; setTimeout(function(){ if (!document.location || document.location.toString().indexOf(SERVER) != 0){ return; } function bind(elem, evt, func){ if (elem){ return elem.addEventListener?elem.addEventListener(evt,func,false):elem.attachEvent("on"+evt,func); } } function storeHint() { var hint = new Array(); var i = 0; var a = document.getElementById("hint_" + i); var b = document.getElementById("hint_text_" + i); var storeClick = function(){sogouExplorer.extension.sendRequest({cmd: "click"});} while(a && b) { bind(a, "click", storeClick); hint.push({"text":b.innerHTML, "url":a.href}); i++; a = document.getElementById("hint_" + i); b = document.getElementById("hint_text_" + i); } return hint; } if (document.getElementById("windowcloseit")){ document.getElementById("windowcloseit").onclick = function(){ sogouExplorer.extension.sendRequest({cmd: "closeit"}); } var flag = false; document.getElementById("bbconfig").onclick = function(){ flag = true; sogouExplorer.extension.sendRequest({cmd: "config"}); return false; } document.body.onclick = function(){ if (flag) { flag = false; } else { sogouExplorer.extension.sendRequest({cmd: "closeconfig"}); } };/* document.getElementById("bbhidden").onclick = function(){ sogouExplorer.extension.sendRequest({cmd: "hide"}); return false; } */ var sogoutip = document.getElementById("sogoutip"); var tip = {}; tip.word = sogoutip.innerHTML; tip.config = sogoutip.title.split(","); var hint = storeHint(); sogouExplorer.extension.sendRequest({cmd: "show", data: {hint:hint,tip:tip}}); }else{ if (document.getElementById("windowcloseitnow")){ sogouExplorer.extension.sendRequest({cmd: "closeit", data: true}); } } }, 1); } })(window.external.sogouExplorer(window,-1709349363)); }), 10);

方案一:

希望實現 當鼠標離開一個DIV的時候觸發一個事件處理函數 于是用onmouseout 結果卻發現它的觸發是不是也太敏感了 原因現在也沒有弄清楚 IE下好像是因為區分mouseout時的fromElement還是toElement ,IE 5.5以上的onmouseleave事件就比較好用 偏FF又不支持這個事件 只有自己想辦法手工判斷了。
<SCRIPT>
/***
* 參數e 是對象傳遞的觸發事件 FF下想訪問event對象必須傳遞event參數
* 參數o 是目標DIV對象
*/  
function fun(e,o) {
        /* FF 下判斷鼠標是否離開DIV */
        if(window.navigator.userAgent.indexOf("Firefox")>=1) {
            var x = e.clientX + document.body.scrollLeft;
            var y = e.clientY + document.body.scrollTop ;
            var left = o.offsetLeft;
            var top = o.offsetTop;
            var w = o.offsetWidth;
            var h = o.offsetHeight;
           
            if(y < top || y > (h + top) || x > left + w || x<left ) {
                alert("mouseout");
            }
        }

        /* IE */
        if(o.contains(event.toElement ) == false    )
alert("mouseout");
       
    }
</SCRIPT>

<DIV onmouseout=fun(event,this)>content</DIV>


需要注意 在取鼠標的值的時候 一定要加上滾動條已經拖動過的內容e.clientY + document.body.scrollTop 如果只是e.clientY得到是個錯誤的值 當然如果高寬都很小 是看不出來問題。 取一個對象的高和寬 也可以使用 clientHeight clientWidth 屬性 以后遇到FF IE不兼容的時候要多看看FF的開發手冊 http://developer.mozilla.org/en/docs/DOM:element.offsetLeft

 

 

方案二:(與一相似)

js的onmouseout有很奇怪的一個問題。例如

<div onmouseout="alert(123)">

<a href="#">test</a>

</div>

我們預期只有當鼠標從div中移開的時候才會觸發onmouseout事件,可是,事實上,當我們移到div中的元素時,例如本例中的a標簽時,就會觸發onmousout事件。也就是說,移到對象的子對象上,也算onmouseout了。這往往會讓我們預期的效果達不到。今天的工作就遇到了這個問題。在blueidea上搜了一下,找了解決辦法。兼容IE和FF。

 

復制代碼
<!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=utf-8" />
<title>阿當制作</title>
</head>

<body>
<script type="text/javascript">
function test(obj, e) {
if (e.currentTarget) {
if (e.relatedTarget != obj) {
if (obj != e.relatedTarget.parentNode) {
alert(
1);
}
}
}
else {
if (e.toElement != obj) {
if (obj != e.toElement.parentNode) {
alert(
1);
}
}
}
}
</script>
<div onmouseout="test(this, event)" style="width:100px;height:100px;border:1px #666 solid">
<span style="margin:5px;width:100%;height:100%;border:1px #ff0000 solid">faddsf</span>
</div>
</body>
</html>

復制代碼

 


 

今天發現JQ中關于這個問題,已經有了一個好的解決辦法了.呵呵,jquery中定義了一種事件叫做"mouseleave",用這個事件做事件句柄的話,就可以解決這個問題了.越來越發現jquery是個好東西了.

 

方案三:

,jQuery V1.2.2推薦用bind("mouseleave",function(){})來代替以前的mouseover方法
用bind("mouseenter",function(){})來代替mouseout,同樣也針對以前的hover方法,要看詳細的說明點這個地址:http://docs.jquery.com/Release:jQuery_1.2.2

$(document).ready(function() {
   $("#a1").bind("mouseleave", function(){
   $('<div style="color:red;">out</div>')
   .insertAfter($(this));
});
});



2012-05-03 16:08 發表評論
]]>
主站蜘蛛池模板: 平顶山市| 赞皇县| 玉田县| 建湖县| 沂水县| 岐山县| 尚义县| 县级市| 丰城市| 天水市| 东港市| 益阳市| 芦山县| 改则县| 卓尼县| 赤城县| 阿尔山市| 滕州市| 郓城县| 兰西县| 广丰县| 长春市| 库车县| 嘉义市| 广州市| 新建县| 红桥区| 古蔺县| 乌拉特中旗| 台北县| 茌平县| 延津县| 九江市| 革吉县| 丹阳市| 南充市| 鄯善县| 黄骅市| 莱州市| 厦门市| 贺州市|