标签: drag-and-drop

我正在使用jQuery UI,可以创建一个简单的拖放列表.但是现在,我想把元素放到另一个列表中.jQuery总是认为该项目已经丢弃在错误的地方并将其滑回原始列表.

在PyQt 4中,我想创建一个QTreeView,可以通过拖放操作重新组织其结构.

我为QTreeView实现了自己的模型(QAbstractItemModel),因此我的QTreeView正确显示了数据.现在我想为树的节点添加拖放支持,以便能够将树内的节点从一个父节点移动到另一个节点,拖动复制等等,但是我找不到任何完整的教程如何实现这一点.我找到了很少的QTreeWidget教程和提示,但没有为自定义模型的QTreeView找到.有人能指出我在哪里看？

谢谢.

我想在android 2.X中拖放图像上的文本视图

请看下面的这张图片.

这里,"蓝色"表示ViewGrop,"白色"表示ImageView,图像在ImageView上设置.写"Fashion"的文字是TextView.这就是我实现结构的方式.现在我想让用户选择TextView并将其拖动到图像的任何部分,然后将其放在图像上所需的位置.

截至目前为参考我试图引用以下网址,但每当我使用TextView而不是按钮时,事情变得异常.

链接文字

任何人都可以给我路线图或示例来完成它吗？

我有两个QListWidget(list1和list2)

• list1 应该能够从中接收物品 list2
• list1 应该能够通过内部拖放重新组织
• list2 应该能够从中接收物品 list1

list1->setSelectionMode(QAbstractItemView::SingleSelection);
list1->setDragEnabled(true);
list1->setDragDropMode(QAbstractItemView::DragDrop);
list1->viewport()->setAcceptDrops(true);
list1->setDropIndicatorShown(true);

ulist2->setSelectionMode(QAbstractItemView::SingleSelection);
list2->setDragEnabled(true);
list2->setDragDropMode(QAbstractItemView::InternalMove);
list2->viewport()->setAcceptDrops(true);
list2->setDropIndicatorShown(true);

我不得不把它list2打开,InternalMove否则当我把它拖到它时,项目不会删除list1.

如果我把list1给InternalMove我不能删除任何更多的就可以了.

我是否必须编写自己的拖放功能才能执行此操作？

如何打开在应用程序图标上拖放的文档？

如何将项目(如图像或其他画布中的其他对象)拖放到由fabricjs管理的画布中？我已经找到了许多如何在canvas中移动项目的例子,但我想将项目从外部元素拖放到画布中.

在HTML5中的浏览器客户端区域上拖动元素时,如何将光标更改为我想要的任何光标？

到目前为止,我只能在拖动时显示默认光标(除了不支持丢弃的无光标).

我不是在谈论以下任何一种情况:

• 使用event.dataTransfer.setDragImage()除了光标来显示图像

• 使用event.dataTransfer.dropEffect以显示除了光标复印件或链路符号,或者将光标改变为无符号

• 在Firefox中,使用event.dataTransfer.mozCursor,因为它只能执行默认的系统行为,或显示箭头光标,这两者都没有帮助(此外,我想要跨浏览器支持,虽然我主要针对Chrome)

我尝试过许多其他的技巧,包括使用CSS :hover和:focus,和许多使用JavasScript招数,都无济于事.

谢谢你的帮助.

我想要实现的是:

在前端,我使用html5文件api来读取文件,然后使用ajax将文件的内容上传到php后端,如果文件大小很小就可以了.但是,如果文件足够大,则会导致chrome崩溃.所以我使用file.slice将大文件拆分成块,当所有块都上传到php时,将块合并为一个完整的块.

代码如下:

前端:

<style>
#container {
     min-width:300px;
     min-height:200px;
     border:3px dashed #000;
}
</style>
<div id='container'>

</div>
<script>
function addDNDListener(obj){
    obj.addEventListener('dragover',function(e){
            e.preventDefault();
            e.stopPropagation();
    },false);
    obj.addEventListener('dragenter',function(e){
            e.preventDefault();
            e.stopPropagation();
    },false);
    obj.addEventListener('drop',function(e){
            e.preventDefault();
            e.stopPropagation();
            var ul = document.createElement("ul");
            var filelist = e.dataTransfer.files;
            for(var i=0;i<filelist.length;i++){
                    var file = filelist[i];
                    var li = document.createElement('li');
                    li.innerHTML = '<label id="'+file.name+'">'+file.name+':</label>  <progress value="0" max="100"></progress>';
                    ul.appendChild(li);
            }
            document.getElementById('container').appendChild(ul);
            for(var i=0;i<filelist.length;i++){
                    var file = filelist[i];
                    uploadFile(file);
            }
    },false);
}

function uploadFile(file){
    var loaded = 0;
    var step = 1024*1024;
    var …

我正在尝试创建一个Windows窗体,我可以删除文件/文件夹.

我在WinForms应用程序中有以下代码

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_DragEnter(object sender, DragEventArgs e)
    {
        Debug.Print("DragEnter");
    }

    private void Form1_DragDrop(object sender, DragEventArgs e)
    {
        MessageBox.Show("Dropped!");
    }
}

我已将AllowDrop属性设置为true.我已经尝试在Visual Studio中的调试中运行该应用程序.基于其他类似问题的答案,我尝试以管理员身份运行已编译的exe.我已经尝试不以管理员身份运行已编译的exe .

但无论我做什么,我都无法触发DragDrop事件.但是,DragEnter事件会触发.我错过了什么？

我正在实现填充空白拖放功能.

Codepen链接

在这里,我有一个上面的答案列表,即一个,两个,三个等,以及下面的空白区域,这些答案将被填充.

事情已经完成

1)从答案列表中拖动选项并填写空框.完成

2)如果我将答案从填充框拖到空框中,则前一个值应为空白.完成

问题来了

1)如果我将答案从填充框拖到另一个填充框中,那么如何切换两个框的值和位置.我认为我们可以获得前一个和当前一个的位置,然后交换位置但不知道如何实现它.

2)如果我将一个值从答案列表拖到一个填充的框中,那么如何交换它们

这是我到目前为止所做的:

$(document).ready(function() {
  var arr;
  $("span").droppable({
    accept: "ul > li",
    classes: {
      "ui-droppable-hover": "ui-state-hover"
    },
    drop: function(event, ui) {
      arr = [];
      var dragedElement = ui.draggable.text();
      $(this).addClass("ui-state-highlight");
      $(this).html(dragedElement);
      $('span').each(function() {
        arr.push($(this).text());
      });
      //console.log(JSON.stringify(arr));

      var matched = arr.filter((value) => value == dragedElement);
      //console.log(JSON.stringify(matched));

      $('span').each(function() {
        if ($(this).text() == matched[1]) {
          $(this).addClass('matched');
          //localStorage.setItem('prevValue', $(this).text());
          $('span.matched').text('');
          $(this).removeClass("ui-state-highlight");
          $(this).removeClass('matched');
        }
      });

      $(this).html(dragedElement);
      $(this).addClass("ui-state-highlight");

    }
  }); …