pc端通過拖放實現新增 刪除功能

2021-08-29 18:13:27 字數 476 閱讀 7688

話不多說上完整**

我的分類

書藏家

其實,拖放刪除和新增這個功能最關鍵的地方就是「攜帶資料」。正是因為利用了datatransfer物件來攜帶資料,才可以像剛才那樣新增和刪除。

下面是攜帶資料的基本思路:

「拖」開始的時候(『拖』通過ondragstart事件***來實現,上面的**有詳細注釋喲),程式把需要攜帶的資料放入datatransfer物件中。

「放」下元素的時候(通過ondrop事件***來實現),程式從datatransfer物件中取出資料,並利用該資料進行相應的處理。上邊的程式就為兩種拖放資料分別新增了、,分別代表需要新增收藏夾的資料和需要刪除的資料。 

好啦,以上就是通過拖動元素來新增和刪除的功能實現。由此可見,通過datatransfer物件,我們可以讓拖放操作實現更豐富的功能。畢竟,datatransfer物件的屬性和方法那麼多,想怎麼搭配都可以~

完整**:

jQuery實現移動端左滑刪除功能

這裡,我們可以直接使用jquery來實現該效果。基本原理 完整的示例 如下 charset utf 8 移動端左滑刪除 右滑恢復效果title src script html body,div,p,ul,li,ol,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,form,fieldset...

linux 下實現本地新增 刪除軟體的功能

linux 下實現本地新增 刪除軟體的功能 redhat linux as 5下實現本地 新增 刪除軟體 1.mount dev cdrom media cdrom 為 光碟 2.mkdir mnt rom 3.ln s media cdrom server mnt rom 4.media cdro...

04 資料的新增和刪除功能的實現

功能需求 fragment可以看做是乙個包裹行的標籤 import react,from react 這裡是初始的資料,用的constructor建構函式的時候,需要用到super 主要是為了解決this問題 constructor 對頁面進行渲染,內部需要return 因為其為function r...