大佬教程收集整理的这篇文章主要介绍了jqueryUI sortable：如何在拖动时强制更新占位符位置，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
如果没有文档化的解决方案,那么无法解决或者讨厌的解决方案可以将可排序的,可拖动的等内部包围在一起,作为最后的手段是可以的.
这里有更多信息：
如果将项目拖动到垂直jQueryUI可排序列表的右侧,除非您向上或向下移动鼠标,否则列表不会排序.一旦你向上或向下移动鼠标(甚至只是1px！),列表就会排序.例子是在http://jsfiddle.net/f3Lhg/并在下面摘录.
这可能看起来像是一个角落的情况,但是当连接列表从一个列表侧向拖动到另一个列表时,它实际上是常见的.即使整个拖拽不完全水平,前30px-100px可能会导致不可预测的拖拽行为和糟糕的用户体验.即使连接列表出现问题更多,您也可以通过拖出列表并从侧面返回列表轻松地使用单个列表进行复制.
问题不是浏览器特定的.在我测试的所有浏览器上,行为都是相同的.此外,添加容差选项无法解决问题.
这是一个jQueryUI错误或预期的行为？有没有已知的解决方法？
顺便说一句,在我的应用程序中,我已将列表连接到右侧,因此我无法使用{axis：’y’}选项,因为这会阻止拖动到连接列表.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.js"></script> <style type="text/css"> .sortable { list-style-type: none; width: 400px; } .sortable li { margin: 5px 0; padding: 30px; border: 1px solid #999; } .sortable li.placeholder { margin: 0; height: 4px; border: 0; padding: 0; BACkground-color: #800; } </style> <script type="text/javascript"> $(document).ready(function () { $('.sortable').sortable({ placeholder: 'placeholder' }).disableSELEction(); }); </script> </head> <body> <ul class="sortable"> <li>Item #1</li> <li>Item #2</li> <li>Item #3</li> <li>Item #4</li> <li>Item #5</li> </ul> </body> </html>
根据轴属性值的设置方式(或不设置),jQuery UI将浮动的属性设置为布尔标志,以跟踪容器是垂直列表还是水平列表(第46行)：
//Let's determine if the items are being displayed horizontally this.floaTing = this.items.length ? o.axis === 'x' || (/left|right/).test(this.items[0].item.css('float')) || (/inline|table-cell/).test(this.items[0].item.css('display')) : false;
此值用于确定在用户拖动元素时jQuery UI如何处理冲突检测.
特别：
方法_intersectsWithSides(第492行)使用浮动属性来确定您没有在水平列表中拖动,因此返回垂直碰撞结果.如果同时存在垂直拖动方向和元素交集,则垂直碰撞检查仅返回true：
if (this.floaTing && horizontalDirection) { return ((horizontalDirection == "right" && isOverRightHalf) || (horizontalDirection == "left" && !isOverRightHalf)); } else { return verticalDirection && ((verticalDirection == "down" && isOverBottomHalf) || (verticalDirection == "up" && !isOverBottomHalf)); }
可以通过从_intersectsWithSides中的返回条件中删除verticalDirection要求来解决您的问题(它也可能导致意外的错误行为).
或者：
如果存在垂直或水平拖动,您可以尝试编辑插件的_IntersectsWithSides方法以返回true：
return (verticalDirection || horizontalDirection) && ((verticalDirection == "down" && isOverBottomHalf) || (verticalDirection == "up" && !isOverBottomHalf)) || ((horizontalDirection == "right" && isOverRightHalf) || (horizontalDirection == "left" && !isOverRightHalf));
以上是大佬教程为你收集整理的jqueryUI sortable：如何在拖动时强制更新占位符位置全部内容，希望文章能够帮你解决jqueryUI sortable：如何在拖动时强制更新占位符位置所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。