blocks|key|385720|text|我改变了一些东西，它起作用了。这里：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|385721|$('#file_file').fileupload({
++++autoUpload:+true,
++++add:+function+(e,+data)+{
++++++++$('body').append('<p+class="upl">Uploading...</p>')
++++++++data.submit();
++++},
++++progressall:+function+(e,+data)+{
++++++++var+progress+=+parseInt(data.loaded+/+data.total+*+100,+10);
++++++++$('#progress+.bar').css(
++++++++++++'width',
++++++++++++progress+%2B+'%25'
++++++++);
++++},
++++done:+function+(e,+data)+{
++++++++$('.upl').remove();
++++++++$.each(data.files,+function+(index,+file)+{
++++++++++++/**/
++++++++});
++++}
});|code-block|syntax|javascript|385722|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I changed couple of things and it works. Here:</p>

<pre><code>$('#file_file').fileupload({
    autoUpload: true,
    add: function (e, data) {
        $('body').append('&lt;p class="upl"&gt;Uploading...&lt;/p&gt;')
        data.submit();
    },
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .bar').css(
            'width',
            progress + '%'
        );
    },
    done: function (e, data) {
        $('.upl').remove();
        $.each(data.files, function (index, file) {
            /**/
        });
    }
});
</code></pre>


blocks|key|167751|text|如果您的服务器没有返回JSON，请尝试删除：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|167752|dataType:+'json'|code-block|syntax|javascript|167753|否则，您可能会以失败事件结束，这很容易测试：|167754|fail:+function(e,+data)+{
++alert('Fail!');
}|167755|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>If your server is not returning JSON, try removing:</p>

<pre><code>dataType: 'json'
</code></pre>

<p>Otherwise you may be ending up with a fail event, which is easy to test for:</p>

<pre><code>fail: function(e, data) {
  alert('Fail!');
}
</code></pre>


blocks|key|385791|text|尝试文档中所述的this+Callback+Option：|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|385792|$('#fileupload').bind('fileuploaddone',+function+(e,+data)+{
++++alert('Done');
});|code-block|syntax|javascript|385793|这对我来说肯定很有效。|385794|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/blueimp/jQuery-File-Upload/wiki/Options#callback-options^0|8|K|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@$A|T|B|U|1|V]]|C|$]]|$1|D|3|E|5|F|7|W|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|X|8|@]|9|@]|C|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|C|$]]]|L|$M|$5|N|O|P|C|$Q|R]]]]

<p>Try <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Options#callback-options" rel="nofollow">this Callback Option</a> as described in the documentation:</p>

<pre><code>$('#fileupload').bind('fileuploaddone', function (e, data) {
    alert('Done');
});
</code></pre>

<p>It sure works for me.</p>


blocks|key|385825|text|我正在使用multer、multer-azure-storage和blueimp+file-upload。所有服务都来自unpkg.com。下面是一个多文件上传与完成触发器。截至17年10月22日。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|385826|js文件：|385827|++<script+src="https://unpkg.com/jquery@3.2.1/dist/jquery.min.js"></script>
++<script+src="https://unpkg.com/blueimp-file-upload@9.19.1/js/vendor/jquery.ui.widget.js"></script>
++<script+src="https://unpkg.com/blueimp-file-upload@9.19.1/js/jquery.iframe-transport.js"></script>
++<script+src="https://unpkg.com/blueimp-file-upload@9.19.1/js/jquery.fileupload.js"></script>|code-block|syntax|javascript|385828|网页html，由express提供：|385829|++++++$('#fileupload').fileupload({
++++++++++url:+'https://domainwhatevs/my-listings/edit/[property+id]/gallery',
++++++++++paramName:+'_file',
++++++++++dataType:+'json',
++++++++++type:+'POST',
++++++++++autoUpload:+true,
++++++++++add:+function+(e,+data)+{
++++++++++++++console.log('uploading:',+data)
++++++++++++++data.submit();
++++++++++},
++++++++++done:+function+(e,+data)+{
++++++++++++++console.log('done+triggered');
++++++++++++++console.log(data._response.result.result[0].originalname,+'uploaded+at',+data._response.result.result[0].url);
++++++++++++++$.each(data.files,+function+(index,+file)+{
++++++++++++++++//+console.log(file.name,+'uploaded.')
++++++++++++++++//+console.log('done');
++++++++++++++++//+console.log(index);
++++++++++++++++//+console.log(file);
++++++++++++++});
++++++++++++++console.log(data);
++++++++++}
++++++});|385830|//+GET+/my-listings/edit/property+id/gallery|385831|app.get(
++++[
++++++++'/my-listings/edit/:_id/gallery'
++++],
++++(req,+res)+=>+{
++++++++console.log('image+gallery:',+req.params._id);
++++++++res.render('my-listings--edit--gallery',+{
++++++++++++_id:+req.params._id,
++++++++++++session:+req.session
++++++++});
++++}
);|385832|//+POST+/my-listings/edit/property+id/gallery|385833|+app.post(
++++[
++++++++'/my-listings/edit/:_id/gallery'
++++],
++++upload.array('_file'),
++++(req,+res,+next)+=>+{
++++++++console.log(req.files);
++++++++res.setHeader('Content-Type',+'application/json');
++++++++res.send({result:+req.files});
++++++++next();
++++}
);|385834|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|X|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|Z|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|10|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|11|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|12|8|@]|9|@]|A|$G|H]]|$1|Q|3|R|5|6|7|13|8|@]|9|@]|A|$]]|$1|S|3|T|5|F|7|14|8|@]|9|@]|A|$G|H]]|$1|U|3|-4|5|6|7|15|8|@]|9|@]|A|$]]]|V|$]]

<p>i'm using multer, multer-azure-storage, and blueimp-file-upload. all served from unpkg.com. below is a multiple file upload with the done trigger. working as of 10/22/17.</p>

<p>js file:</p>

<pre><code>  &lt;script src="https://unpkg.com/jquery@3.2.1/dist/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://unpkg.com/blueimp-file-upload@9.19.1/js/vendor/jquery.ui.widget.js"&gt;&lt;/script&gt;
  &lt;script src="https://unpkg.com/blueimp-file-upload@9.19.1/js/jquery.iframe-transport.js"&gt;&lt;/script&gt;
  &lt;script src="https://unpkg.com/blueimp-file-upload@9.19.1/js/jquery.fileupload.js"&gt;&lt;/script&gt;
</code></pre>

<p>page html, served from express:
          </p>

<pre><code>      $('#fileupload').fileupload({
          url: 'https://domainwhatevs/my-listings/edit/[property id]/gallery',
          paramName: '_file',
          dataType: 'json',
          type: 'POST',
          autoUpload: true,
          add: function (e, data) {
              console.log('uploading:', data)
              data.submit();
          },
          done: function (e, data) {
              console.log('done triggered');
              console.log(data._response.result.result[0].originalname, 'uploaded at', data._response.result.result[0].url);
              $.each(data.files, function (index, file) {
                // console.log(file.name, 'uploaded.')
                // console.log('done');
                // console.log(index);
                // console.log(file);
              });
              console.log(data);
          }
      });
</code></pre>

<p>// GET /my-listings/edit/[property id]/gallery</p>

<pre><code>app.get(
    [
        '/my-listings/edit/:_id/gallery'
    ],
    (req, res) =&gt; {
        console.log('image gallery:', req.params._id);
        res.render('my-listings--edit--gallery', {
            _id: req.params._id,
            session: req.session
        });
    }
);
</code></pre>

<p>// POST /my-listings/edit/[property id]/gallery</p>

<pre><code> app.post(
    [
        '/my-listings/edit/:_id/gallery'
    ],
    upload.array('_file'),
    (req, res, next) =&gt; {
        console.log(req.files);
        res.setHeader('Content-Type', 'application/json');
        res.send({result: req.files});
        next();
    }
);
</code></pre>


<p>I use <a href="https://github.com/blueimp/jQuery-File-Upload">jQuery-File-Upload</a> plugin. I wrote a simple code to test it - and it works, but not without problems. It doesn't trigger <code>done</code>, even if the file is uploaded and progress bar reached its end.</p>

<p>Here's the code:</p>

<pre><code>$('#file_file').fileupload({
    dataType: 'json',
    autoUpload: true,
    add: function (e, data) {
        data.context = $('&lt;p/&gt;').text('Uploading...').appendTo(document.body);
        data.submit();
    },
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .bar').css(
            'width',
            progress + '%'
        );
    },
    done: function (e, data) {
        alert('Done');
    }
});
</code></pre>

<p>My input is as simple as that:</p>

<pre><code>&lt;input type="file" id="file_file" name="file[file]" /&gt;
</code></pre>


jQuery FileUpload doesn't trigger 'done'

服务器

JSON

我使用插件。我写了一个简单的代码来测试它-它可以工作，但不是没有问题。它不会触发done，即使文件已经上传并且进度条已经结束。代码如下：$('#file_file').fileupload({    dataType: 'json',    autoUpload: true,    add: function (e, ...

问jQuery FileUpload没有触发“done”
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery FileUpload没有触发“done”EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery FileUpload没有触发“done”
EN