請解釋一些javascricpt代碼

-2

這是一個浮動窗口的例子。我知道，點擊鼠標拖動文件功能被稱爲。請解釋兩個div的用途，以及drag函數使用的拖拽函數和movehandler。請解釋這些功能的確切功能，以及這些功能中的e和px符號是什麼？請解釋一些javascricpt代碼

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> 
<title>Floating Window</title> 
<script src="Drag.js"></script> 
</head> 
<body> 

<div id="window" style="position:absolute; z-index:10; left:350px; top:160px; width:400px;background-color:#dde3eb; border:1px solid #464f5a;"> 

    <div style="padding-bottom:8px; width:400px; background-color:#718191; border-bottom:1px solid #464f5a;" onMouseDown="beginDrag(this.parentNode, event);"> 

     <div style="position:absolute; top:2px; left:5px; font-size:16px; font-weight:bold; color:#FFFFFF;">Drag me!</div> 

     <div style="position:absolute; top:3px; left:377px; float:right;" onClick="this.parentNode.parentNode.style.display = 'none"> 



     </div> 

    </div> 
<br/> 
    <div style="margin-left:20px;">your content here...</div> 

    <div style="margin-left:30px;">your content here...</div> 

    <div style="margin-left:40px;">your content here...</div> 
<br/> 

</div> 



</body> 

function beginDrag(elementToDrag, event){ 
    var deltaX = event.clientX - parseInt(elementToDrag.style.left); 
    var deltaY = event.clientY - parseInt(elementToDrag.style.top); 
    if (document.addEventListener){ 
     document.addEventListener("mousemove", moveHandler, true); 
     document.addEventListener("mouseup", upHandler, true); 
    } 
    else if (document.attachEvent){ 
     document.attachEvent("onmousemove", moveHandler); 
     document.attachEvent("onmouseup", upHandler); 
    } 
    else { 
     var oldmovehandler = document.onmousemove; 
     var olduphandler = document.onmouseup; 
     document.onmousemove = moveHandler; 
     document.onmouseup = upHandler; 
    } 
    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; 
     elementToDrag.style.left = (e.clientX - deltaX) + "px"; 
     elementToDrag.style.top = (e.clientY - deltaY) + "px"; 
     if (e.stopPropagation) e.stopPropagation(); 
     else e.cancelBubble = true; 
    } 
    function upHandler(e){ 
     if (!e) e = window.event; 
     if (document.removeEventListener){ 
      document.removeEventListener("mouseup", upHandler, true); 
      document.removeEventListener("mousemove", moveHandler, true); 
     } 
     else if (document.detachEvent){ 
      document.detachEvent("onmouseup", upHandler); 
      document.detachEvent("onmousemove", moveHandler); 
     } 
     else { 
      document.onmouseup = olduphandler; 
      document.onmousemove = oldmovehandler; 
     } 
     if (e.stopPropagation) e.stopPropagation(); 
     else e.cancelBubble = true; 
    } 
}

來源

2011-02-13 mubeen

`e`是觸發事件的對象。 `「px」`用於像素。但是，如果你不知道這一點，那麼你肯定會對這個代碼不瞭解。也許有時間閱讀一本書？之後，你可以問一個更具體的問題，而不是在這裏粘貼一個網站，問問什麼是問題。 :) – GolezTrol 2011-02-13 13:38:47

我是新來的JavaScript，但已經做了很多其他的編程語言，所以請不要抨擊我，如果我去稍有不妥

2的div：它僅僅是HTML元素之一，它是用來區分你目前正在

uphandler其中HTML的一部分：是您已在HTML身下宣佈自定義功能，我不太清楚有什麼功能不

和'moveHandler'函數一樣，從外觀上看它的moveHandler功能作出修改什麼款式什麼的

希望這會幫助

來源

2011-02-13 13:57:10

請解釋一些javascricpt代碼

回答

相關問題