文章/答案/技术大牛

发布

社区首页 >问答首页 >扩展dropzone.js功能的Jquery

问扩展dropzone.js功能的Jquery
EN

Stack Overflow用户

提问于 2013-09-29 17:08:47

回答 1查看 1.3K关注 0票数 0

当前正在尝试实现图像上传器。不幸的是，我不是一个javascript程序员，但幸运的是有人开发了http://www.dropzonejs.com/。我试图增强这个javascript。我想要实现的一件事是重组图像的能力。为此，将使用jquery。

下面是组成图像预览的所有html的示例。

<div class="dz-preview dz-processing dz-image-preview dz-success">
<div class="dz-details">
<div class="dz-filename">
<div class="dz-size" data-dz-size="">
<img data-dz-thumbnail="" alt="2.png" src="">
</div>
<div class="dz-progress">
<div class="dz-success-mark">
<div class="dz-error-mark">
<div class="dz-error-message">
</div>

因此，我试图创建代码，这将允许我重新组织照片。为此，我正在实现一些动画方法，一旦实现，我将使用jquery将其剪切和“粘贴”到新位置。

方法，用于单击图像预览时的onclick (当前没有调用任何内容)。

$( document ).ready(function() {
$('.dz-details:image').bind( "click", function(){
console.log('clicked');
    var pos1 = $('#demo-upload').position();
    $(this).animate({ 'top': pos1.top + 'px', 'left': pos1.left + 'px'}, 200, function(){
        //probably find position here and insert div
    });
});
});

单击和拖动div时，我可能会使用.remove()。并使用类似于下面的内容将其插入到新的位置。

$(loca).append(div);'

一些方向是有帮助的

javascript

jquery

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-09-30 00:53:46

我通过在模板中添加javascript onclick方法调用来修改dropzone.js

previewTemplate: "<div class=\"dz-preview dz-file-preview\" onclick=\"moveDiv(this)\" >\n     <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"dz-progress\"><span class=\"dz-upload\" data-dz-uploadprogress></span></div>\n  <div class=\"dz-success-mark\"><span>✔</span></div>\n  <div class=\"dz-error-mark\"><span>✘</span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>"
    };

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/19080841

复制

相似问题

问扩展dropzone.js功能的Jquery
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问扩展dropzone.js功能的JqueryEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问扩展dropzone.js功能的Jquery
EN