首頁 > 開發者 > JavaScript
原文地址：http://www.cnblogs.com/lln7777/archive/2012/03/21/2409404.html
比如一個網頁的聊天室，捲軸會隨著內容的增加自動往下滾動。
當使用者滑鼠在捲軸上按下的時候，我們可以假設他（她）正在瀏覽聊天內容，那麼這個時候好的使用者體驗就不能讓捲軸再自動滾動了。
為了實現這個功能，可能大家首先會想到的就是mouse down 和 mouse up事件了。
可是具體實現的時候我們會發現在捲軸上按下滑鼠左鍵再鬆開的時候，捕獲不到mouse up了。如下面例子
<html>
<head>
<title></title>
<script type="text/javascript">
var captureTarget = null;
function down(obj, e) {
captureTarget = obj;
// 如果是IE可以開啟注釋
// captureTarget.setCapture();
e = e ? e : window.event;
}
function up(obj,e) {
// if (captureTarget)
// captureTarget.releaseCapture();
e = e ? e : window.event;
div2.innerText = e.srcElement.tagName;
}
document.addListener = function(event, callback) {
if (!document.all)
this.addEventListener(event, callback);
else
this.attachEvent("on"+event, callback);
}
document.addListener("mouseup", function(){alert(1);});
</script>
</head>
<body >
<div style="width:200px;height:200px;overflow:scroll" onmousedown="down(this, event);">
<div style="height:500px; width:500px"></div>
</div>
</body>
</html>
儲存為html格式檔案，瀏覽器開啟，然後在捲軸上左鍵點擊試試，再在其他地方點擊試試。
由於沒有深入研究過W3C的文檔，這裡只能猜想。
考慮到捲軸的特性，可能瀏覽器在滑鼠按下捲軸的時候給捲軸setCapture了，而滑鼠鬆開之後給他releaseCapture，捲軸又不屬於Dom對象，所以在滑鼠釋放之前無法捕獲mouseup事件。
純粹猜想，歡迎板磚。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
