Uploadify说当我直接将DOM对象传递给它时找不到占位符元素但是Uploadifive有效,为什么?

时间:2012-11-08 03:14:41

标签: knockout.js uploadify

我试图使用uploadify / uploadifive with knockout并且不断收到有关无法找到占位符元素的错误。该错误仅在运行使用uploadify(flash)版本的IE时发生。其他浏览器很好,因为他们使用uploadifive(html5)。为什么不在IE中工作?

HTML

<input type="file"  data-bind="imageUpload: images"  />

自定义绑定

        ko.bindingHandlers.imageUpload = {
        init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
            var uploadCallback = function (file, data, response) {
                valueAccessor().collection().add(JSON.parse(data));
            };
            window.setTimeout(function () {
              $(element).uploadifive({
                  'method': 'post',
                  'fileObjName': 'FileData',
                  'uploadScript': 'Image/Upload',
                  'onUploadComplete': uploadCallback,
                  'onFallback': function () {
                      $(element).uploadify({
                          'method': 'post',
                          'fileObjName': 'FileData',
                          'swf': '/Scripts/Uploadify/uploadify.swf',
                          'uploader': 'Image/Upload',
                          'onUploadSuccess': uploadCallback
                      });
                  }});
             }, 0);
           }
         }

1 个答案:

答案 0 :(得分:1)

问题是没有在输入元素上放置id并且需要将uploadify创建代码包装在超时函数中。问题中的代码反映了将调用包装到$ .uploadify的超时。这是因为uploadify在内部使用swfupload,它将尝试通过id查询输入元素。如果您不想在input元素上放置id属性,您还可以在uploadify脚本中添加一些代码来生成id。

这是我添加的内容

        //Add id to DOM object if it doesn't exist. 
        if (!$this.attr('id')) {
            $this.attr('id', 'uploadify' + uploadControlIdCounter);
            uploadControlIdCounter += 1;
        }

同样的事情还有更多的背景。

    /*
   Uploadify v3.1.1
   Copyright (c) 2012 Reactive Apps, Ronnie Garcia
   Released under the MIT License <http://www.opensource.org/licenses/mit-license.php> 
   */

   (function($) {
   var uploadControlIdCounter = 0;
   // These methods can be called by adding them as the first argument in the uploadify plugin call
var methods = {

    init : function(options, swfUploadOptions) {

        return this.each(function() {

            // Create a reference to the jQuery DOM object
            var $this = $(this);

            //Add id to DOM object if it doesn't exist. 
            if (!$this.attr('id')) {
                $this.attr('id', 'uploadify' + uploadControlIdCounter);
                uploadControlIdCounter += 1;
            }