Tag: 拖放

将多个行从一个表拖放到另一个表

我需要通过从表格到另一个表格中选择所需的行来拖放表格行。 首先提供从一个表中选择所需行的选项，然后需要将所有选定的行拖放到其他表中。 我已经完成了将表格从表格拖放到另一个表格的示例。 找到以下代码： HTML： ID ClassName 1 Class 1 1 Student 1 2 Student 2 3 Student 3 4 Student 4 5 Student 5 2 Class 2 6 Student 6 7 Student 7 8 Student 8 9 Student 9 10 Student 10 ID ClassName 1 Class 1 1 Student 1 2 Student 2 3 […]

jquery droppable – >避免多次丢弃同一个对象

我有一个容器具有不同的可拖动元素，并且有一些“目标”div的列表，用户可以删除可拖动的元素。 示例：想象一下，您有一个“标签”列表（House，Computer，Car，..）和一些文档列表作为目标（所有文档都是div ）。 因此目标是使用拖放操作将“标签”分配给文档。 顺便说一句，每个tag-Div都有一个唯一的id（ ） 使“标签”可拖动的代码： $(‘#taglist’).find(‘div’).draggable( {helper: “clone”}); 使文件“可投放”的代码： $(‘#doclist’).droppable({ drop: function( event, ui ) {tag=ui.draggable; tag.clone().appendTo( this ); } }); 到目前为止，这很有效。 问题是，现在您可以将相同的标签多次分配给相同的文档。 示例：文档1可以标记“House”5次，标记“计算机”3次。 我的目标是，每个文档只能有一次标记。 我不知道，如何解决这个问题。 现在，我有办法： 1.）通过走DOM $（this）来扩展“drop”函数.find …看看，如果有一个具有相同id的元素 – 在这种情况下，不要再次克隆和追加。 可能这需要很多性能。 2.）使用可拖动小部件的“接受”function。 但我不知道在这种情况下如何使用它。 谢谢你的帮助。

Draggable Resizable无法在Chrome中运行

我在使用chrome中的图像上进行可resize和可拖动的工作时遇到了一些问题。 我的页面有一个（可拖动的）图像列表，可以放在div上（图像被克隆）。 丢弃的图像应该可以resize和拖动。 我写了以下Javascript： $(function() { $(“.scrollable”).scrollable(); $(“.draggable”).draggable({ helper: ‘clone’, appendTo: ‘body’ }); $(“#canvas”).droppable({ accept: ‘.draggable’, drop: function(e, ui){ if (ui.draggable.attr(“class”).indexOf(‘item’) == -1){ var clone = $(ui.draggable).clone(); clone.removeClass(“ui-draggable draggable”); clone.addClass(‘item’); $(this).append(clone); $(‘.item’).resizable({ containment: ‘parent’, aspectRatio: true }).parent().draggable({ containment: ‘parent’ }); } } }); }); 这在Firefox中生成以下代码，完美地运行： 但是在chrome中，元素被拖动和克隆，但它们没有显示。 从以下代码生成中可以明显看出： 但是，我无法理解为什么图像的宽度和高度以及相应的外部div的宽度和高度达到0px。 一个简单的解决方案是在javascript中改变高度/宽度，但我相信会有更好的解决方案。 谢谢你的帮助。

使用jquery.event.drag拖动多个元素

我想用jQuery插件jquery.event.drag拖动多个元素 这是原始演示的小提琴 ： 这是原始演示的链接： 在演示中，用户点击他想要选择的方块并拖动它们。 但我想做一些最简单的事情：只需点击方块“1”并移动所有方块。 我尝试了不同的东西，结果并不好，看到这个小提琴： http://jsfiddle.net/Vinyl/gVFCL/2/ 你能帮那我吗？ HTML代码： CSS代码 .drag { position: absolute; border: 1px solid #89B; background: #BCE; height: 58px; width: 58px; cursor: move; top: 120px; } .selected { background-color: #ECB; border-color: #B98; } jQuery的 jQuery(function($){ $(‘.drag’) .click(function(){ $( this ).toggleClass(“selected”); }) .drag(“init”,function(){ if ( $( this ).is(‘.selected’) ) return $(‘.selected’); }) […]

如何在’drop`事件后停止重定向？

将文件放入Firefox中的div后，网页将被重定向到此文件。 我试图在drop handler中使用jQuery的e.preventDefault()来阻止这种传播，但是失败了。 看到这个演示 ，将文件放入#test不会重定向网页，但是进入#test1会，我想知道原因。 我是否应该始终将处理程序绑定到dragenter ， dragover ， dragleave和drop以防止drop后传播？ 更新： 我在html5doctor上找到了一些提示： 要告诉浏览器我们可以放入这个元素，我们所要做的就是取消dragover事件。 但是，由于IE的行为不同，我们需要为dragenter事件做同样的事情。 而Mozilla 声称 ： dragenter和dragover事件的监听器用于指示有效的放置目标，即拖放项目可能被丢弃的位置。 但我在firefox上测试了这个演示 ， #test1工作和#test1没有，似乎Mozilla犯了一个错误，而html5doctor是对的：Firefox需要dragover才能让drop工作。

无法获得JQuery Draggable插件吗？

我是JQuery新手，我正在尝试使用Draggable插件创建一个示例页面。 页面加载正常，但我无法将我的 标签拖到任何地方。 我一直试图复制这个演示 。 这是我的代码： #draggable { width: 150px; height: 150px; padding: 0.5em; border: solid 1px black; cursor:pointer;} $(document).ready(function() { $(“#draggable”).draggable(); }); Drag me around 我只是想做到这一点，所以我可以在它周围的“demo” 拖动我的“draggable” 。 任何人都能看到我错过的东西吗？

当用户将文本拖放到文本框中时，如何使用JQuery检测值更改事件？

我正在使用这个jQuery代码 $(‘input’).bind(‘change mouseup’, … ) 检测用户是否将文本拖到我的输入中并更改其值。 但这似乎不起作用。 为什么它不起作用，我怎么能让它工作？

jQuery UI可拖动+ iframe中的可排序 – 错误的垂直偏移

我正在解决这个问题，我不知道该怎么做。 情况：我在页面顶部有可拖动的元素，在iframe中有一些可排序的持有者。 当我尝试将元素拖动到iframe时，它工作正常。 但是，当iframe向下滚动并开始拖动可拖动元素时，它会连接到iframe中的第一个可排序的持有者，而不是连接到当前位于iframe可见部分顶部的可排序持有者。 js完整代码： https ： //jsfiddle.net/0d420qpj/ 屏幕video ： http ： //screencast-o-matic.com/watch/coltDdhakq 观看video，您将看到问题在于行动。 $(“.drag”).draggable({ helper : “clone”, iframeFix: $(‘#iframe’), iframeOffset: $(‘#iframe’).offset(), connectToSortable : f.find(“.sort_holder”), distance : 10, cursorAt: { left: 20, top : 20}, scroll : true, start: function(event, ui) { }, drag: function(event, ui) { }, stop: function(event, ui) { } }); 能帮我解决这个问题吗？

父帧和子iframe之间的拖放元素

我试图使用jQuery在父框架和iframe之间拖放元素。 我在父框架中有一个面板，其中包含一些可拖放到子框架上的可拖动项目。 我试图搜索很多但找不到多少…… 我尝试通过在子帧中附加元素然后尝试以编程方式触发新插入元素上的draggable来解决它，但我也被卡在那里。 找不到触发拖动function的正确方法。 （draggable元素有一个帮助器。当我通过触发“mousedown.draggable”触发拖动时，ui-draggable元素上的位置发生了变化，但我看不到帮助器。 谢谢！！

确定浏览器是否具有拖放能力？

我正在实现jQuery文件上传，并试图找出检测客户端是否可以支持拖放的最佳方法，这样我就可以渲染类似“拖放文件到这里上传”的内容，只有他们能够真正做到这一点。 在插件代码中，我可以看到函数isXHRUploadCapable几乎与拖放支持相关，但我认为这比任何事情更巧合。 （它使用iFrames发布上传而不是IE和Opera的XMLHTTPRequest上传）。 如果支持拖放，看不到任何让我知道的东西，所以我怀疑它只是一个事件发生或不发生。 文档说“Windows版本的Safari不支持拖放.MSIE和Opera不支持拖放，多文件选择或上传进度指示。” 那么，也许只是Windows版本的Safari支持XMLHTTPRequest上传，而不是拖放？ 无论如何 – 我试图找出最好的方法来检测浏览器是否支持使用此插件拖放上传，我不知道如何做到这一点。 拖放function是否可以轻松测试？ 我该怎么办？ 这个function是依赖于浏览器，还是Jquery Upload是否特别支持该浏览器？