Questions tagged «drag-and-drop»

我遇到的问题是，dragleave悬停该元素的子元素时会触发该元素的事件。另外，dragenter在再次将父元素悬停时不会触发。 我做了一个简化的提琴：http : //jsfiddle.net/pimvdb/HU6Mk/1/。 HTML： <div id="drag" draggable="true">drag me</div> <hr> <div id="drop"> drop here <p>child</p> parent </div> 使用以下JavaScript： $('#drop').bind({ dragenter: function() { $(this).addClass('red'); }, dragleave: function() { $(this).removeClass('red'); } }); $('#drag').bind({ dragstart: function(e) { e.allowedEffect = "copy"; e.setData("text/plain", "test"); } }); 应该做的是div在拖曳某物时通过将其下拉为红色来通知用户。这可行，但是如果您拖入p孩子，则将dragleave被发射，而div不再是红色。返回到下拉列表div也不会再次使其变为红色。有必要将其完全移出下拉菜单div，然后再次拖回下拉菜单以使其变为红色。 dragleave拖动到子元素中时是否可以防止触发？ 2017更新： TL; DR，pointer-events: none;按照下面@HD的回答中所述查找CSS ，该CSS 在现代浏览器和IE11中均有效。

300 javascript  jquery  html  drag-and-drop  jquery-events 

我已经在Borland的Turbo C ++环境中看到了这一点，但是我不确定如何针对正在开发的C＃应用​​程序进行此操作。是否有最佳实践或陷阱？

251 c#  winforms  drag-and-drop 

我正在向页面添加html5拖放上传器。 将文件放到上载区域后，一切正常。 但是，如果我不小心将文件放在了上传区域之外，浏览器将加载本地文件，就像它是一个新页面一样。 如何防止这种行为？ 谢谢！

194 javascript  jquery  html  drag-and-drop 

按照目前的情况，这个问题不适合我们的问答形式。我们希望答案会得到事实，参考或专业知识的支持，但是这个问题可能会引起辩论，争论，民意调查或扩展讨论。如果您认为此问题可以解决并且可以重新提出，请访问帮助中心寻求指导。 7年前关闭。 是否有一个很好的整洁jQuery插件，该插件允许包含一个JS脚本，然后使用简单的代码段启用表单？像这样： $j('#MyForm').enableDragDropUploads('.upload-area') 上载目标是表单的操作。 任何解决方案都不能阻止常规文件字段的使用（使用传统的浏览方法）。 我一次只需要一个文件，尽管当然可以选择多个文件也不是一件坏事。 我发现一对夫妇的拖放上传的例子： http://www.appelsiini.net/2009/10/drag-and-drop-file-upload-with-google-gears HTTP：//www.appelsiini。 net / 2009/10 / html5-拖放多个文件上传 但是这里的代码没有设置为插件。更改它可能不太困难，但是如果其他人已经完成了这项工作并且只是在逃避我的Google搜索，那么这样做也没有意义。 理想情况下，我正在寻找纯HTML5 / jQuery解决方案。 可以使用Google Gears，但不能使用Flash解决方案。

174 jquery  file-upload  drag-and-drop  html  google-gears 

总览 我具有以下HTML结构，并且将dragenter和dragleave事件附加到了<div id="dropzone">元素上。 <div id="dropzone"> <div id="dropzone-content"> <div id="drag-n-drop"> <div class="text">this is some text</div> <div class="text">this is a container with text and images</div> </div> </div> </div> 问题 当我将文件拖到时<div id="dropzone">，dragenter事件将按预期触发。但是，当我将鼠标移到子元素（例如）上时<div id="drag-n-drop">，会dragenter为该<div id="drag-n-drop">元素dragleave触发该事件，然后为该<div id="dropzone">元素触发该事件。 如果我<div id="dropzone">再次将鼠标悬停在该元素上，dragenter则会再次触发该事件，这很酷，但是随后dragleave为刚刚剩下的子元素触发了该事件，因此removeClass执行了该指令，这并不酷。 此行为有问题的原因有两个： 我只是附上 dragenter＆dragleave，<div id="dropzone">所以我不明白为什么子元素也要附加这些事件。 我仍在将<div id="dropzone">元素悬停在其子元素上时拖动元素，所以我不想dragleave开火！ jsFiddle 这是一个可以修补的jsFiddle： http //jsfiddle.net/yYF3S/2/ 题 所以...我该怎么做，以至于当我在<div id="dropzone">元素上拖动文件时，dragleave即使我在任何子元素上拖动也不会触发...仅当我离开该<div id="dropzone">元素时才触发。 。在元素边界内的任何位置悬停/拖动都不会触发dragleave事件。 我需要它与跨浏览器兼容，至少在支持HTML5拖放的浏览器中是这样，所以这个答案是不够的。 …

163 jquery  html  file-upload  drag-and-drop  dom-events 

如今，我们可以将文件拖放到一个特殊的容器中，并使用XHR 2上载它们。带有实时进度条等。非常酷的东西。这里的例子。 但是有时候我们不想那么酷。我想要的是将文件（一次很多）拖放到标准HTML文件输入中：<input type=file multiple>。 那可能吗？有什么方法可以从文件拖放中用正确的文件名（？）“填充”文件输入吗？（出于文件系统安全性原因，完整的文件路径不可用。） 为什么？因为我想提交一份普通表格。适用于所有浏览器和所有设备。拖放只是逐步增强，可以增强和简化UX。具有标准文件输入（+ multiple属性）的标准表单将在那里。我想添加HTML5增强功能。 编辑 我知道在某些浏览器中，您有时可以（几乎总是）将文件拖放到文件输入本身中。我知道Chrome通常会执行此操作，但是有时会失败，然后将文件加载到当前页面中（如果您要填写表单，则会导致很大的失败）。我想愚弄和浏览器证明。

163 html  file-upload  drag-and-drop 

我的问题是2折，我希望WPF提供的解决方案比WinForms的标准解决方案（在我澄清之前，Christophe Geers提供的）更简单。 首先，有没有一种方法可以使Window可拖动而不捕获和处理鼠标单击+拖动事件？我的意思是窗口可以通过标题栏拖动，但是如果我将一个窗口设置为没有窗口并且仍然希望能够拖动它，是否可以通过某种方式将事件重新定向到处理标题栏拖动的任何方式？ 其次，是否有一种方法可以将事件处理程序应用于窗口中的所有元素？如图所示，无论用户单击并拖动哪个元素，都使其可拖动。显然，无需手动将处理程序添加到每个元素。只是在某个地方做一次？

111 c#  wpf  user-interface  drag-and-drop 

我正在使用HTML5构建拖放式Web应用程序，并将文件拖放到div上，当然要获取dataTransfer对象，这给了我FileList。 现在，我想删除一些文件，但是我不知道怎么办，或者甚至可能。 最好是我只想从FileList中删除它们；我没有用。但是，如果那不可能，我是否应该在与FileList交互的代码中编写检查代码？那看起来很麻烦。

111 javascript  html  drag-and-drop  filelist 

我需要将图像文件拖放到WPF应用程序中。当我放入文件时，我当前有一个事件触发，但是我不知道下一步该怎么做。我如何获得图像？为sender对象的图像或控制？ private void ImagePanel_Drop(object sender, DragEventArgs e) { //what next, dont know how to get the image object, can I get the file path here? }

106 c#  .net  wpf  image  drag-and-drop 

我想要一个视图，其中有周围行驶的车辆，用户也可以拖放。您认为执行此操作的最佳大规模策略是什么？最好从代表车辆的视图还是从较大的视图获取触摸事件？是否有您满意的用于拖放的简单范例？不同策略的缺点是什么？

93 iphone  ipad  ios  drag-and-drop  touch 

似乎在我期望的时间没有触发drop事件。 我假设当被拖动的元素在目标元素上方释放时，将触发drop事件，但事实并非如此。 我有什么误会？ http://jsfiddle.net/LntTL/ $('.drop').on('drop dragdrop',function(){ alert('dropped'); }); $('.drop').on('dragenter',function(){ $(this).html('drop now').css('background','blue'); }) $('.drop').on('dragleave',function(){ $(this).html('drop here').css('background','red'); })

92 javascript  jquery  events  drag-and-drop  jquery-events 

我在页面上有可以用jQuery拖动的元素。这些元素是否具有单击事件，该事件会导航到另一个页面（例如普通链接）。 什么是防止单击引发未拖放状态同时允许其不处于拖放状态的最佳方法？ 我对可排序元素有此问题，但认为最好有一种常规拖放的解决方案。 我已经为自己解决了这个问题。之后，我发现Scriptaculous存在相同的解决方案，但也许有人有更好的方法来实现这一目标。

85 javascript  jquery  events  drag-and-drop  jquery-ui-sortable 

我还没有看到执行此操作的示例。API规范中不允许这样做吗？ 我正在寻找一种简单的拖放解决方案，用于上传整个文件夹的照片树。

81 html  file-upload  drag-and-drop 

关闭。这个问题需要调试细节。它当前不接受答案。 想改善这个问题吗？更新问题，使其成为Stack Overflow的主题。 6年前关闭。 改善这个问题 当我从设置为溢出的容器div中拖动div时，会产生不期望的效果：滚动。 我找到了其他人遇到问题的示例，但是我找不到解决方案 粘贴箱示例 发生的事情是滚动只是增加了，我可以理解为什么如果您想拖动到可滚动div内的目标位置，但是我希望能够将其移出滚动控制范围之外，这将是理想的行为。

77 jquery-ui  drag-and-drop 

在我的IntelliJ Idea 13.1.2 IDE中，我一直遇到通过笔记本电脑触摸板单击并拖动的情况。我一直不小心单击并拖动文本和切割线。我已经在选项和设置面板中搜索了“单击并拖动”一词，但没有找到关闭此功能的方法。IntelliJ的帮助讨论了如何使用单击和拖动切割，但没有说明如何禁用它。有谁知道如何通过在IntelliJ IDE中单击和拖动来禁用剪切和粘贴？

73 intellij-idea  drag-and-drop  editor  settings