标签: drag-and-drop

将文件拖放到Cocoa中的Dock图标上

如何将Info.plist中指定类型的文件(或选择在Finder中打开)放到我的停靠栏图标上,然后使用文件的完整路径调用方法?

cocoa drag-and-drop file dock

14
推荐指数
3
解决办法
8419
查看次数

jQuery UI可排序和两个连接列表

我试图将以下内容与jQuery和Sortable放在一起:我需要抓住两种情况:

  • 答:移动同一列表中的项目
  • B:将项目从一个列表移动到另一个列表

仅使用事件时解决案例B. receive但是如果我绑定两者receive并且stop在将项目从一个列表移动到另一个列表时也会被解雇.这使得我无法捕获案例A,因为我无法确定该项目是从其他列表移动还是在同一列表中移动.希望有道理.

这有点奇怪,因为我会认为我的用例是最常用的用例.

我渴望创意.如果您想尝试一下,请参阅http://jsfiddle.net/39ZvN/5/.

HTML:

<div id="list-A">
  <ul class="sortable">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
  </ul>
</div>
<br />
<div id="list-B">
  <ul class="sortable">
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
  </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

$(function() {
  $('.sortable').sortable({
    stop: function(event, ui) {
      // Wird auch aufgerufen wenn von Liste X nach Liste Y gezogen wird
      if(!ui.sender) alert("sender null");
      else alert("sender not null");
    },
    receive: function(event, ui) {
      // …
Run Code Online (Sandbox Code Playgroud)

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

14
推荐指数
1
解决办法
3万
查看次数

谷歌地图将对象拖放到地图外部的谷歌地图中

我正在研究一个项目,我需要一个关于如何将地图外部的对象拖放到其中的帮助.我尝试了很多例子,但我找不到解决方案,所以如果你能提供一些代码示例来帮助和感谢.

jquery google-maps drag-and-drop

14
推荐指数
1
解决办法
9741
查看次数

Html5拖放svg元素

我想跟随HTML5拖放教程这里.我无法dragstartrect元素上注册该事件.如果我将事件更改为draggable,mousedown则调用handleDragStart处理程序.请忽略代码中的其他空白注册.

JSFiddle 在这里


<!DOCTYPE html>
<html><head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <style type="text/css" media="screen">
    svg rect { cursor: move; }
  </style>
</head><body>
  <h1>SVG/HTML 5 Example</h1>
  <svg id="cvs">
    <rect draggable="true" x="0" y="10" width="100" height="80" fill="#69c" />
    <rect x="50" y="50" width="90" height="50" fill="#c66" />        
  </svg>
  <script type="text/javascript" src="loc.js"></script>
</body></html>
Run Code Online (Sandbox Code Playgroud)

loc.js

$(document).ready(function() {    
    function handleDragStart(e) {
        log("handleDragStart");                
          this.style.opacity = '0.4';  // this ==> e.target is the source node.
    };

    var registercb = function …
Run Code Online (Sandbox Code Playgroud)

jquery html5 svg drag-and-drop

14
推荐指数
2
解决办法
2万
查看次数

为jquery-ui-sortable拖动事件

如何在拖动drag时听取事件jquery-ui-sortable

通过命中试验策略,我尝试了drag事件,jquery-ui-draggable但它不起作用.

$('.widget_container').sortable({
    drag: function(event, ui) { console.log('drag'); }
});
Run Code Online (Sandbox Code Playgroud)

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

14
推荐指数
1
解决办法
2万
查看次数

java用鼠标移动组件

我试图通过简单地添加鼠标监听器和使用setLocation函数来使任何组件可拖动java.awt.Component.我开始JButton测试是否有可能按照我的想法.

这是我想要做的代码示例:

import java.awt.*;
import javax.swing.*;

public class DragButton extends JButton{

private volatile int draggedAtX, draggedAtY;

public DragButton(String text){
    super(text);
    setDoubleBuffered(false);
    setMargin(new Insets(0, 0, 0, 0));
    setSize(25, 25);
    setPreferredSize(new Dimension(25, 25));

    addMouseListener(new MouseAdapter(){
        public void mousePressed(MouseEvent e){
            draggedAtX = e.getX() - getLocation().x;
            draggedAtY = e.getY() - getLocation().y;
        }
    });

    addMouseMotionListener(new MouseMotionAdapter(){
        public void mouseDragged(MouseEvent e){
            setLocation(e.getX() - draggedAtX, e.getY() - draggedAtY);
        }
    });
}

public static void main(String[] args){
    JFrame frame = new JFrame("DragButton"); …
Run Code Online (Sandbox Code Playgroud)

java swing drag-and-drop awt mouselistener

14
推荐指数
2
解决办法
2万
查看次数

Trello拖放效果

有没有人知道Trello如何做那些漂亮的拖放效果,所选择的卡片与文本可见的角度略有不同?

我喜欢认为我会查看网络上的任何网站并大致了解所有内容是如何完成的,但我从未见过像这样的效果无缝完成.它是一个预渲染的图像,它在服务器上动态设置并在拖动开始时加载?

我知道的完全无聊的问题!

drag-and-drop trello

14
推荐指数
1
解决办法
2617
查看次数

VB.net - 拖放并获取文件路径?

我希望能够将文件/可执行文件/快捷方式拖到Windows窗体应用程序中,让应用程序确定删除文件的原始路径,然后将其作为字符串返回?

例如,将图像从桌面拖到应用程序和消息框中,然后向上移动图像的本地路径.

那可能吗?有人可以给我一个例子吗?

谢谢

vb.net drag-and-drop winforms

14
推荐指数
2
解决办法
5万
查看次数

如何在e2e AngularJS测试中上传文件?

在我的一个视图中,我有一个文件上传控件.它支持通过拖放或通过单击按钮后打开的标准文件对话框上传文件.

如何在我的e2e测试1中做到这一点?


1只需两个选项中的一个即可

javascript testing drag-and-drop file-upload angularjs

14
推荐指数
1
解决办法
2106
查看次数

在页面上拖放文件 - 缺乏一致的解决方案

这就是我想要实现的目标:

页面上有多个dropzones.用户应该能够从他们的操作系统中拖动文件并将其放入dropzones.

Dropzones在拖动过程中会突出显示.有两种视觉上不同类型的突出显示:"目标"(例如,元素以虚线边框勾勒出轮廓)和"悬停"(例如,元素获得明亮的背景).

目标突出显示同时在所有下拉列表中应用/删除:

  • 当用户在页面上拖动文件时,应使用目标突出显示突出显示所有下拉区域.
  • 当用户在页面外拖动文件,或取消拖放操作或执行拖放操作时,应从所有下拉区域中删除目标突出显示.

悬停突出显示应仅适用于一个dropzone:

  • 当用户在dropzone上拖动文件时,应使用悬停突出显示突出显示该dropzone.
  • 当用户将文件拖放到该dropzone之外,或取消拖放操作或执行拖放时,应从dropzone中删除目标突出显示.

当用户在dropzone上删除文件时,该文件的名称应该出现在dropzone中.

当用户在dropzones外部的页面上删除文件时,应删除所有突出显示的区域,并且不会发生任何其他情况.具体而言,浏览器不应打开已删除的文件.

解决方案应尽可能优雅:不喜欢使用超时,计数dragenter/ dragleave事件和重新应用突出显示等脏兮兮的黑客行为dragover.

该解决方案应该适用于主流浏览器的最新版本.

这是我到目前为止所取得的成就:尝试1,尝试2.

我成功解决的问题

  1. 删除dropzone之外的文件会导致浏览器打开该文件.

    解:

    $(document).on('dragover drop', function (e) {
        e.preventDefault();
    });
    
    Run Code Online (Sandbox Code Playgroud)
  2. 将文件拖放到dropzone会生成一个drop事件,其目标等于dropzone的子级而不是dropzone本身.

    解:

    $dropzones.on( 'drop', function (event) {
    
      /* ... */
    
      // Find the dropzone responsible for the event
      $targetDropzone = $(event.target).closest($dropzones);
    
      /* ... */
    });
    
    Run Code Online (Sandbox Code Playgroud)
  3. 将文件悬停在dropzone的子节点上会生成多个dragleave事件,使悬停突出显示立即消失(当鼠标光标离开dropzone时,应从dropzone删除悬停突出显示,因此它将绑定到dragleave事件).

    解决方案:使用dragout事件代替dragleave.dragoutjquery.event.dragout插件提供的自定义事件.元素的孩子不会触发此事件.

未解决的问题

  1. 无法检测拖动文件离开document或的时刻 …

javascript jquery html5 drag-and-drop

14
推荐指数
2
解决办法
2985
查看次数