javascript實(shí)現(xiàn)移動(dòng)端上的觸屏拖拽功能？JS，有三個(gè)主要事件：touch start、touch move和touch end。這三個(gè)事件最重要的屬性是pagex和pagey，它們表示X和Y坐

javascript實(shí)現(xiàn)移動(dòng)端上的觸屏拖拽功能？

JS，有三個(gè)主要事件：touch start、touch move和touch end。這三個(gè)事件最重要的屬性是pagex和pagey，它們表示X和Y坐標(biāo)。Touchstart在觸摸開(kāi)始時(shí)觸發(fā)事件touchend，觸摸結(jié)束時(shí)觸發(fā)事件touchmove。這件事很奇怪。在接觸的過(guò)程中不斷觸發(fā)這一事件是合理的。但是，在某些設(shè)備中，它在觸發(fā)touchstart之后觸發(fā)一次，其余的幾乎與touchend同時(shí)觸發(fā)。這三個(gè)事件都有timestamp屬性。如果你看一下timestamp屬性，您可以看到順序是touchstart-> touchmove-> touchmove->-> touchmove-> TouchEnd。下面是一個(gè)代碼示例：document.getElementsByTagName文件（“body”[0].addEventListener（“touchstart”，函數(shù)（e）{nStartY=e.targetTouches[0].pageY nStartX=e.targetTouches[0].pageX}）document.getElementsByTagName文件（“body”[0]。addEventListener（“touchend”，函數(shù)（e）{nChangY=e.changedTouches[0]。pageY Nchangx=e.changedTouches[0]。頁(yè)碼：1。觸摸事件和點(diǎn)擊事件不會(huì)同時(shí)觸發(fā)?，F(xiàn)在移動(dòng)設(shè)備做得更好，完全避免了這個(gè)問(wèn)題。

2. 注意觸摸開(kāi)始和結(jié)束的位移。如果位移太小，就不要做任何動(dòng)作。

使用js實(shí)現(xiàn)的簡(jiǎn)單拖拽效果？

dnd.js公司它主要為我們提供兩種使用對(duì)象，一滴和一滴?？梢哉J(rèn)為一個(gè)用于拖動(dòng)圖元，另一個(gè)用于放置區(qū)域。其實(shí)，它也是這樣用的。

主要用法：

創(chuàng)建拖動(dòng)元素newdrag和拖放區(qū)域newdrop，然后在回調(diào)函數(shù)中實(shí)現(xiàn)所需的邏輯。重要的是回調(diào)函數(shù)。對(duì)于拖放操作，這包括一系列拖放操作。

對(duì)于要拖放的元素，操作包括：拖放開(kāi)始和拖放結(jié)束。此時(shí)，一個(gè)函數(shù)被分別發(fā)送給這個(gè)事件（所謂的回調(diào)函數(shù)）。此函數(shù)只能接受一個(gè)參數(shù)。假設(shè)參數(shù)名為params，params中的內(nèi)容幾乎可以使您執(zhí)行無(wú)限操作。讓我們看看參數(shù)是什么，以及如何操作拖放過(guò)程？

數(shù)據(jù)：拖動(dòng)對(duì)象包含數(shù)據(jù)。這一定是個(gè)數(shù)字？

作為一個(gè)來(lái)自ASP時(shí)代的老程序員，我們可以負(fù)責(zé)任地說(shuō)，web開(kāi)發(fā)拖拽控件在10多年前與Microsoft aspdotnet一起推出時(shí)已經(jīng)超越了所謂的webform技術(shù)，技術(shù)已經(jīng)實(shí)現(xiàn)，并且它仍然處于產(chǎn)品生命周期中。雖然沒(méi)有更新新功能，但仍有正常的產(chǎn)品維護(hù)。

在webform技術(shù)剛剛誕生的時(shí)代，許多Delphi/VB開(kāi)發(fā)人員剛剛從拖拽控制轉(zhuǎn)向web開(kāi)發(fā)。在這個(gè)時(shí)候，webform，它有著類似于本地開(kāi)發(fā)的簡(jiǎn)單的入口和事件模型，甚至一經(jīng)推出就變得流行起來(lái)。它已成為開(kāi)發(fā)B/s（即所謂的瀏覽器/服務(wù)器）應(yīng)用程序的首選技術(shù)。

那是一個(gè)互聯(lián)網(wǎng)不太流行的時(shí)代，每個(gè)人都在做MIS。盡管webform很流行，但這是因?yàn)閣ebform的事件模型本質(zhì)上需要提交一個(gè)頁(yè)面并與后端服務(wù)器交互，這與Ajax和其他技術(shù)在根本上是矛盾的。而且，通過(guò)拖拽控件，頁(yè)面會(huì)產(chǎn)生大量冗余的HTML標(biāo)簽，導(dǎo)致頁(yè)面尺寸巨大，CSS很難應(yīng)用。

隨著web開(kāi)發(fā)技術(shù)的發(fā)展，用戶對(duì)前端體驗(yàn)的要求越來(lái)越高，瀏覽器和W3C標(biāo)準(zhǔn)也在不斷演進(jìn)，甚至有專門(mén)的前端開(kāi)發(fā)工程師。在本例中，代碼臃腫、體驗(yàn)差的webform已經(jīng)被手工編寫(xiě)的HTML/CSS/JS頁(yè)面所取代。

當(dāng)然，市場(chǎng)一直需要以拖放控件的形式進(jìn)行無(wú)代碼或無(wú)代碼開(kāi)發(fā)。微軟也嘗試在后期推出LightSwitch等f(wàn)lash即插即用技術(shù)，但一般來(lái)說(shuō)，目前HTML頁(yè)面主要是手工開(kāi)發(fā)。然而，隨著單頁(yè)應(yīng)用程序spa和web組裝等HTML技術(shù)的出現(xiàn)，很有可能在未來(lái)會(huì)出現(xiàn)許多拖動(dòng)控件開(kāi)發(fā)工具。讓我們拭目以待。