Question

我正在使用jquery-fileupload插件（https://github.com/tors/jquery-fileupload-rails）来显示我的rails应用中的文件上传进度。以下代码工作正常。

在我的index.html.erb中我有

  <script id="template-upload" type="text/x-tmpl">
  <div class="upload">
    {%=o.name%}
    <div class="progress"><div class="bar" style="width: 0%;"></div></div>
  </div>
  </script>

在我的项目js.coffee文件中我有

$('#import_form').fileupload
    dataType: "json"
    add: (e, data) ->
      data.context = $(tmpl("template-upload", data.files[0]))
      $('#import_form').append(data.context)
      data.submit()
    progress: (e, data) ->
      if data.context
        progress = parseInt(data.loaded / data.total * 100, 10)
        data.context.find('.bar').css('width', progress + '%')

但是当我点击一个id为import_button而不是自动的按钮时，我希望上传开始。我怎样才能做到这一点？

我尝试执行以下操作，但收到错误消息“数据未定义”

$('#import_form').fileupload
    dataType: "json"
    add: (e, data) ->       
      data.context = $(tmpl("template-upload", data.files[0]))
      $('#import_form').append(data.context)
      $("#import_button").off("click").on "click", ->
        data.submit()
    progress: (e, data) ->
      if data.context
        progress = parseInt(data.loaded / data.total * 100, 10)
        data.context.find('.bar').css('width', progress + '%')

请帮助谢谢

Answer 1

一个特殊的回调是add回调，因为它为data参数提供了一个提交方法，它将启动文件上传：

$('#fileupload').fileupload({
    add: function (e, data) {
       data.submit();
    }
});

来自jQuery Plugin Wiki

因此，如果您不想自动启动上传，请使用add回调，但不要调用submit方法。

单击按钮时在轨道中上载Jquery文件

1 个答案: