HTML5拖放与jQuery UI拖放

Question

2017年制作拖放构建器的最佳方法是什么？是的,之前已经问过这个问题,但那是5年前,我认为事情已经改变了？HTML5,jQuery UI还是现在还有其他选择吗？

一个更新的问题表单生成器从头开始 - HTML 5拖放,或JQuery UI可拖动,或什么？也没有得到答复.

任何帮助都会很棒!我已经开始兼顾两者了(我从来没有使用过HTML5或jQuery UI的Drag and Drop,所以我很难做出决定.)jQuery UI似乎更容易使用和理解,但也似乎非常错,很好至少在codepen中.

Answer 1

我们刚刚用ReactJs对Drag and Drop进行了一些研究,老实说对方有点伤感.因此,如果您正在寻找纯HTML 5拖放,这是一个很棒的网站,向您展示你是如何搞砸的:https: //caniuse.com/#feat=dragndrop

因此,截至撰写本文时,如果你使用纯HTML5 DND,你真的不会涵盖移动方案.

现在未列出的是所有边缘情况,以使该功能在浏览器中看起来相同.在Edge,Firefox和Chrome之间,添加一个Icon以显示您正在拖动项目,一个在复制的元素上有轻微的不透明度,而另一个则执行其他操作.无论哪种方式,对准这些设计(根据您的设计团队是多么烦人)可以很容易(如不只要关心的拖放作品)几乎是不可能的(例如获得,而我摆脱拖动图标).

现在谈到JQuery,它已经存在了一段时间,但这并不意味着它也没有它的缺点.因为它在JS层而不是浏览器本身中运行,取决于系统中发生了多少,它会感觉有点慢.此外,我确实注意到它开始拖动恼人的情况,例如当您尝试滑动页面以在Edge中滚动时.这本身也可能是糟糕的编程.

我想最后我们只使用了React Dnd和HTML5后端.似乎工作得很好,对于那些移动场景,我们只有菜单选项,以不同的形式公开相同的功能.它最终帮助了可访问性,因为解释通过键盘快捷键拖放的所有操作都有点烦人.

不确定这是否有帮助,但如果我记得(并且已经有大约6个月)那就是失败了.