Tag: 可拖动

jQuery的UI – Draggable不是一个函数？: 我试图在页面上的一些div上使用可拖动的效果，但每当我加载页面，我得到的错误消息： Error: $(".draggable").draggable is not a function 我看了一下，似乎其他人有这个问题，因为他们没有包括jQuery UI JavaScript文件，但我肯定有。以下是我的页面的标题： <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 任何人都可以提出解决scheme 任何意见赞赏。谢谢。快速编辑，我也有jquery工具包括在页面的头部，如果我删除这个工程确定。有没有人设法让这两个一起工作？

可移动/可拖动<div>: 这是我的更新和修改的脚本，它的工作原理是完全的，除了我想普及它…观察****我怎么能使它，所以我不必做function(e){BOX.Draggable.elemen = e.target || e.srcElement; elementDraggable(e); function(e){BOX.Draggable.elemen = e.target || e.srcElement; elementDraggable(e); 每次我需要使用不同元素的可拖动function？ window.onload = addListeners; var BOX = function(){ return{ Draggable: function(){} }; }(); function addListeners(){ document.getElementById('div').addEventListener('contextmenu', menumove, false); **document.getElementById('div').addEventListener('mousedown', function(e){BOX.Draggable.elemen = e.target || e.srcElement; elementDraggable(e);}, false);** } function elementDraggable(e){ var e = e || window.event; var div = BOX.Draggable.elemen; BOX.Draggable.innerX = e.clientX + […]

jquery draggable：如何限制可拖动区域？: 我有一个可拖动的对象（div）和一些可拖动的对象（表格TD）。我希望用户把我的可拖动的对象拖到其中一个可丢弃的TD上。我可以通过这种方式来拖放和拖放： $(".draggable").draggable(); $(".droppable").droppable(); 问题在于，用户可以通过拖动屏幕上的任何位置，包括可投放区域。如何限制可拖动对象的边界区域？

确定从dragenter和dragover事件中拖出的内容: 我试图使用HTML5可拖动的API（虽然我意识到它有问题）。到目前为止，我遇到的唯一不足就是我无法find一个方法来确定当dragover或dragenter事件触发时被拖动的东西： el.addEventListener('dragenter', function(e) { // what is the draggable element? }); 我意识到我可以认为这是dragstart事件的最后一个元素，但是…多点触控。我也尝试使用dragstart e.dataTransfer.setData来附加一个唯一的标识符，但显然这些数据是从dragover / dragenter 无法访问的：这个数据只有在下降事件发生时才会出现。那么，有什么想法？更新：在撰写本文时，HTML5的拖放似乎并没有在任何主stream的移动浏览器中实现，从而在实践中提出了多点触摸模拟的观点。然而，我想要一个解决scheme，保证在任何规范的实现工作，这似乎并没有排除多个元素被同时拖动。我已经发布了一个工作解决scheme ，但这是一个丑陋的黑客。我仍然希望有更好的答案。

没有jQuery UI的可拖动div: 正如标题所说，我试图让一个div可拖动，而不使用jQuery UI。不过，我被下面的代码填塞了。我知道我将使用相对于容器div的鼠标位置（div将被拖动），并且我将设置相对于这些值的div偏移量。我只是不知道如何。任何线索对我来说？此代码不（当然）工作： var X, Y; $(this).mousedown(function() { $(this).offset({ left: X, top: Y }); }); $("#containerDiv").mousemove(function(event) { X = event.pageX; Y = event.pageY; });

在contenteditable内精确拖放: 安装程序所以，我有一个自信的div – 我正在编辑一个所见即所得的编辑器：粗体，斜体，格式化，最近和最近：插入花哨的图像（在一个漂亮的盒子里，带有标题）。 <a class="fancy" href="i.jpg" target="_blank"> <img alt="" src="i.jpg" /> Optional Caption goes Here! </a> 用户添加这些奇特的图像，我给他们一个对话框：他们填写的细节，上传图像，然后很像其他编辑器function，我使用document.execCommand('insertHTML',false,fancy_image_html); 根据用户的select将其插入。期望的function 所以，现在，我的用户可以在一个奇特的形象扑面而来 – 他们需要能够移动它。用户需要能够点击并拖动图像（花式框和全部）以将其放置在满意的任何地方。他们需要能够在段落之间，甚至段落之间移动 – 如果他们想要的话，可以在两个词之间移动。什么给我希望请记住 – 在一个可以理解的情况下，普通的旧的<img>标签已经被这个可爱的拖放function的用户代理所祝福了。默认情况下，您可以在任何地方拖放<img>标签。默认的拖放操作就像人们梦寐以求的那样。所以，考虑到这个默认行为已经对我们的<img>伙伴如此捣蛋 – 我只想将这个行为扩展一点，以包含更多的HTML – 这看起来应该是很容易实现的。我的努力到目前为止首先，我使用draggable属性设置了我喜欢的<a>标签，并禁用了contenteditable（不知道是否有必要，但似乎也可以closures）： <a class="fancy" […] draggable="true" contenteditable="false"> 然后，因为用户仍然可以将图像拖出花哨的<a>框，我不得不做一些CSS。我正在使用Chrome，所以我只向你展示-webkit-前缀，尽pipe我也使用了其他的。 .fancy { -webkit-user-select:none; -webkit-user-drag:element; } .fancy>img { -webkit-user-drag:none; […]

防止图像被拖动或select，而不使用JS: 有没有人知道的方式来使图像不可拖动，而不是可选 – 在Firefox中，而不诉诸于JavaScript？似乎微不足道，但这是问题： 1）可以在Firefox中拖动和突出显示： <img src="…"> 2）所以我们添加这个，但拖动时图像仍然可以突出显示： <img src="…" draggable="false"> 3）所以我们添加这个，以解决突出的问题，但是直觉上违反了，图像再次拖动。奇怪，我知道！使用FF 16.0.1 <img src="…" draggable="false" style="-moz-user-select: none;"> 那么，有没有人知道为什么添加“-moz-user-select：none”，会以某种方式王牌和禁用“draggable = false”？当然，webkit按预期工作。互联网上没有关于这个的东西……如果我们能够一起照亮这些东西，那将是非常棒的。谢谢！！编辑：这是关于保持UI元素被无意中拖动和提高可用性 – 不是一些跛脚的尝试在复制保护scheme:-)

jQuery可拖动页面滚动后显示帮助错误的地方: 我正在使用jQuery 可拖动和可拖动的工作计划系统，我正在开发。用户将作业拖至不同的date或用户，然后使用ajax调用更新数据。一切工作正常，除了当我向下滚动主页面（工作出现在超过我的浏览器窗口的底部大周计划）。如果我尝试在这里拖动一个可拖动的元素，那么元素会出现在我的鼠标光标上方，像素数量已经向下滚动。hover状态仍然正常，function很强大，但是看起来不正确。我使用jQuery 1.6.0和jQuery UI 1.8.12。我确定有一个补偿函数，我需要添加，但我不知道在哪里应用它，或者如果有更好的方法。这是我的.draggable()初始化代码： $('.job').draggable({ zIndex: 20, revert: 'invalid', helper: 'original', distance: 30, refreshPositions: true, }); 任何想法我可以做什么来解决这个问题？

jQuery拖放使用现场活动: 我有一个长列表的应用程序经常更改，我需要该列表的项目是可拖动的。我一直在使用jQuery UI可拖动插件，但添加到400多个列表项目的速度很慢，每次添加新列表项时都必须重新添加。有谁知道一个插件类似于jQuery UI可拖动插件，使用jQuery 1.3的.live()事件吗？这将解决这两个问题。