成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

jsPlumb（4）-元素拖放

Lowky / 2009人閱讀

摘要：使用的一個(gè)普通的特性就是元素的拖放。拖拽內(nèi)嵌元素拖拽多個(gè)元素拖拽時(shí)文本選中瀏覽器默認(rèn)的拖拽行為是選擇里的元素。廢止了這種行為，沒有。為了支持這種情況，被拖拽元素都增加了這個(gè)類。在拖拽結(jié)束后被去除。

使用jsPlumb的一個(gè)普通的特性就是元素的拖放。方法如下：
myInstanceOfJsPlumb.draggable("elementId");

接受的參數(shù)類型

元素id的字符串

元素

list類型對(duì)象，內(nèi)容是元素或字符串
舉個(gè)栗子

數(shù)組
jsPlumbInstance.draggable(["elementOne", "elementTwo"]);

jQuery選擇器
jsPlumbInstance.draggable($(".someClass"));

節(jié)點(diǎn)列表

var els = document.querySelectorAll(".someClass");
jsPlumbInstance.draggable(els);
可選項(xiàng)

如果你真的不能使用 jsPlumb.draggable，那你就不得不通過jsPlumb.repaint手動(dòng)處理。
jsPlumb是jsPlumbInstance類的一個(gè)實(shí)例。如果你使用自己的實(shí)例，確保你調(diào)用的是這些實(shí)例的拖放方法，而不是全局的。

如果你是用的是vanilla jsPlumb，它提供一個(gè)打包好的庫叫Katavorio——提供多種拖放方式。

需要的CSS

你必須把你要設(shè)置可拖放的元素設(shè)置為position:absolute。

not finished
拖拽容器

使容器內(nèi)的內(nèi)容也可以拖拽。

jQuery：

jsPlumb.draggable($("someSelector"), {
  containment:"parent"
});

Vanilla

jsPlumb.draggable("someElement", {
   containment:true
});
not finished
拖拽內(nèi)嵌元素
not finished
拖拽多個(gè)元素
not finished
拖拽時(shí)文本選中

瀏覽器默認(rèn)的拖拽行為是選擇DOM里的元素。jQuery廢止了這種行為，vanilla jsPlumb沒有。為了支持這種情況，被拖拽元素都增加了_jsPlumb_drag_select這個(gè)類。

在拖拽結(jié)束后被去除。

內(nèi)容如下：

._jsPlumb_drag_select * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;    
}

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/86039.html

相關(guān)文章

  • jsPlumb（3）-基本概念

    摘要：介紹是用來連接元素的，所以核心是，其中又分為以下四個(gè)概念一個(gè)和某個(gè)相關(guān)元素的位置。有四種類型貝塞爾曲線直線流程圖狀態(tài)機(jī)。一個(gè)由兩個(gè)一個(gè)，可有可無。每個(gè)有一個(gè)關(guān)聯(lián)的。的公共只有和，創(chuàng)建和配置。但是你需要熟悉其內(nèi)部的的概念。 介紹 jsPlumb是用來連接元素的，所以核心是Connection，其中又分為以下四個(gè)概念： Anchor 一個(gè)和某個(gè)相關(guān)元素的位置。你不能創(chuàng)建它們，非可視化，只...

    tulayang 評(píng)論0 收藏0

  • jsPlumb（1） - 開始使用

    摘要：社區(qū)版本為開發(fā)者在他們的網(wǎng)頁上提供可視化的元素連接。在現(xiàn)代的瀏覽器使用，在和以下版本使用。建議用戶自己設(shè)置。到目前為止，一個(gè)在每個(gè)終點(diǎn)都有，在中間有一個(gè)標(biāo)簽，添加四個(gè)元素，實(shí)際添加的元素取決于渲染器使用的是還是。 jsPlumb jsPlumb社區(qū)版本為開發(fā)者在他們的網(wǎng)頁上提供可視化的元素連接。在現(xiàn)代的瀏覽器使用SVG，在IE8和以下版本使用VML。 jsPlumb沒有額外的依賴。 ...

    LoftySoul 評(píng)論0 收藏0

  • 記一次繪圖框架技術(shù)選型: jsPlumb VS mxGraph

    摘要：公司項(xiàng)目需要用到繪圖框架，繪圖部分以前是另一位同事負(fù)責(zé)，用的是框架。基于以上提及到的種種原因，上年年末我做起了技術(shù)調(diào)研，希望能找到一個(gè)合適我們項(xiàng)目的繪圖框架。兼容性問題項(xiàng)目對(duì)瀏覽器兼容性比較寬松，瀏覽器兼容性問題不在考慮范圍之內(nèi)。 showImg(https://ws3.sinaimg.cn/large/006tKfTcgy1g0ppk2kkhxj30ka0b4gm5.jpg); 公司...

    longmon 評(píng)論0 收藏0

  • 記一次繪圖框架技術(shù)選型: jsPlumb VS mxGraph

    摘要：公司項(xiàng)目需要用到繪圖框架，繪圖部分以前是另一位同事負(fù)責(zé)，用的是框架?；谝陨咸峒暗降姆N種原因，上年年末我做起了技術(shù)調(diào)研，希望能找到一個(gè)合適我們項(xiàng)目的繪圖框架。兼容性問題項(xiàng)目對(duì)瀏覽器兼容性比較寬松，瀏覽器兼容性問題不在考慮范圍之內(nèi)。 showImg(https://ws3.sinaimg.cn/large/006tKfTcgy1g0ppk2kkhxj30ka0b4gm5.jpg); 公司...

    channg 評(píng)論0 收藏0

  • jsplumb+dragable+vue(一)

    摘要：基于的，支持拖拽生成節(jié)點(diǎn)，節(jié)點(diǎn)雙擊展示更多信息，節(jié)點(diǎn)連線，刪除節(jié)點(diǎn)，刪除連線，重繪連接圖，當(dāng)前頁面刷新連接圖，根據(jù)畫連接圖等功能本章主要講拖拽生成節(jié)點(diǎn)獲取鏈接圖的信息引入需要的文件因?yàn)橐盟砸肓水嬤B接圖用因?yàn)橛玫乃赃@樣引入拖 基于vue的jsplumb，支持拖拽生成節(jié)點(diǎn)，節(jié)點(diǎn)雙擊展示更多信息，節(jié)點(diǎn)連線，刪除節(jié)點(diǎn)，刪除連線，重繪連接圖，當(dāng)前頁面刷新連接圖，根據(jù)json畫連接圖等功能...

    Imfan 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<