Question

我正在尝试将一个uploadify上传视频按钮放在一个可拖动的元素中。

我的上传视频部分视频/ _new_video

<p>Upload your Video </p>
<div id="video_attachment"></div>

<%= content_for (:scripts) do%>
<script type="text/javascript">
  $(function() {
    <% session_key = Rails.application.config.session_options[:key] %>
    var uploadify_script_data = {};
    var csrf_token = $('meta[name=csrf-token]').attr('content');
    var csrf_param = $('meta[name=csrf-param]').attr('content');

    uploadify_script_data[csrf_param] = encodeURI(encodeURIComponent(csrf_token));
    uploadify_script_data['<%= session_key %>'] = '<%= cookies[session_key] %>';

    $('#video_attachment').uploadify({
      uploader  : '<%= asset_path("uploadify/uploadify.swf") %>',
      script    : '<%= videos_path %>',
      wmode     : 'transparent',
      cancelImg : '<%= asset_path("uploadify/cancel.png") %>',
      fileDataName    : 'attachment',
      scriptData : uploadify_script_data,
      auto      : true,
      buttonText : 'Browse',
      onAllComplete : function(event, data){
        alert("Success!  Please be patient while the video processes.");
      },
      onError: function(event, ID, fileObj, errorObj){
        alert("There was an error with the file you tried uploading.\n Please verify that it is the correct type.")
      }
    });
  });
</script>

的application.js

//= require jquery
//= require jquery_ujs
//= require uploadify/jquery.uploadify.v2.1.4.min
//= require uploadify/swfobject

profile.js

$(document).ready( function(){

/* For edit_draggable */
    $("#edit-draggable").draggable();

$("#edit-draggable").hide();

});

在我的个人资料/节目中，uploadify将在可拖动的div之外工作，如下所示：

<%= render "videos/new_video"%> 
<div id="edit-draggable" class="ui-widget-content ui-dialog">

    <%= render "edit"%>
</div>

但它在这个可拖动的div中不起作用：

<div id="edit-draggable" class="ui-widget-content ui-dialog">
    <%= render "videos/new_video"%>   
    <%= render "edit"%>
</div>

任何人都知道问题是什么？

提前感谢您的帮助！

Answer 1

这应该有效：

.draggable({ cursor: "move", cancel: '.uploadify'})

Answer 2

好的，我已经弄明白了，所以我要回答我自己的问题。

原来，没有拖动句柄的可拖动div会掩盖div中的click事件，因此uploadify按钮被draggable阻止。

解决方案是添加一个拖动手柄，因此div只能通过单击div的一部分来拖动。

uploadify在jquery draggable div中不起作用

2 个答案: