本文為大家分享了完美實(shí)現(xiàn)js拖拽效果的具體代碼，告訴大家return false的用法，供大家參考，具體內(nèi)容如下
1.return false可以用來阻止默認(rèn)事件即系統(tǒng)默認(rèn)事件。例如通過阻止默認(rèn)事件，來對(duì)textarea中的值進(jìn)行范圍限制（通過限制keycode的數(shù)值），也可以自定義在頁(yè)面中的右鍵菜單（oncontextmenu）。
2.在鼠標(biāo)移動(dòng)（mousemove）等事件中，是需要給事件傳一個(gè)參數(shù)，保證程序的正常運(yùn)行。而為了兼容取事件方法為：var oEvent=ev||event;
3.在節(jié)點(diǎn)中創(chuàng)建一個(gè)新的節(jié)點(diǎn)的方法為：
var oBox=document.createElement('div'); oBox.className='box'; oBox.style.left = oDiv.offsetLeft+'px'; oBox.style.top = oDiv.offsetTop+'px'; oBox.style.width = oDiv.offsetWidth+'px'; oBox.style.height = oDiv.offsetHeight+'px'; document.body.appendChild(oBox); //注意，在創(chuàng)建完之后一定要將創(chuàng)建好的節(jié)點(diǎn)加入body中！！！下列為完整代碼：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>完美拖拽2</title> <style> *{ margin: 0; padding: 0; } #div1{ width: 150px; height: 150px; background: #71C525; position: absolute; } .box{ border: 2px dashed black; position: absolute; } </style> <script> window.onload=function() { var oDiv = document.getElementById('div1'); var disX=null; var disY=null; oDiv.onmousedown=function(ev) { var oEvent=event||ev; disX=oEvent.clientX-oDiv.offsetLeft; disY=oEvent.clientY-oDiv.offsetTop; var oBox=document.createElement('div'); oBox.className='box'; oBox.style.left = oDiv.offsetLeft+'px'; oBox.style.top = oDiv.offsetTop+'px'; oBox.style.width = oDiv.offsetWidth+'px'; oBox.style.height = oDiv.offsetHeight+'px'; document.body.appendChild(oBox); document.onmousemove=function(ev) { var oEvent=event||ev; var l=oEvent.clientX-disX; var t=oEvent.clientY-disY; if (l<0) { l=0; } else if (l>document.documentElement.clientWidth-oDiv.offsetWidth) { l=document.documentElement.clientWidth-oDiv.offsetWidth; } if (t<0) { t=0; } else if (t>document.documentElement.clientHeight-oDiv.offsetHeight) { t=document.documentElement.clientHeight-oDiv.offsetHeight; } oBox.style.left = l+'px'; oBox.style.top=t+'px'; }; document.onmouseup=function() { document.onmousedown=null; document.onmousemove=null; oDiv.style.left = oBox.offsetLeft+'px'; oDiv.style.top = oBox.offsetTop+'px'; document.body.removeChild(oBox); }; return false;//阻止默認(rèn)事件（系統(tǒng)默認(rèn)事件）！ }; }; </script></head><body> <div id="div1"></div></body></html>以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
