Flash Runtime не работает в IE8 с использованием PLupload

Question

У меня есть простая функция javascript внутри $(function() { ... }); body

var uploader = new plupload.Uploader({
         runtimes: 'html5,flash,silverlight',
         browse_button: 'pickfiles',
         container: 'uploader',
         max_file_size: '20mb',
         unique_names: true,
         multiple_queues: false,
         //drop_element: 'dropzone',
         url: '/Home/Upload',
         flash_swf_url: '../../../Scripts/upload/plupload.flash.swf',
         silverlight_xap_url: '../../../Scripts/upload/plupload.silverlight.xap',
         filters: [
               { title: "Image files", extensions: "jpg,gif,png" },
               { title: "Zip files", extensions: "zip" }
           ],
         chunk_size: '2mb',
         resize: { width: 320, height: 240, quality: 90 }
      });

      uploader.bind("Init", function (up, params) {
         $("#runtime").html("<div>Current runtime: " + params.runtime + "</div>");
      });

      $("#uploadfiles").bind("click", function (e) {
         uploader.start();
         e.preventDefault();
      });

      uploader.init();

      uploader.bind("FilesAdded", function (up, files) {
         $.each(files, function (i, file) {
            $('#runtime').append(
                '<div id="' + file.id + '">' +
                    file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' +
           '</div>');
         });
         up.refresh();
      });

      uploader.bind("UploaderProgress", function (up, file) {
         $("#" + file.id + " b").html(file.percent + "%");
      });

      uploader.bind("Error", function (up, file) {
         $('#runtime').append("<div>Error: " + err.code +
                ", Message: " + err.message +
                (err.file ? ", File: " + err.file.name : "") +
                "</div>");
         up.refresh();
      });

      uploader.bind("FileUploaded", function (up, file) {
         $("#" + file.id + " b").html("100%");
      });

и HTML-код

<div class="container">
                  <div>Logo: </div>
                  <div style="clear"></div>
                  <div id="uploader">
                    <div id="runtime" class="right">
                        No runtime was found !
                    </div>
                    <div>
                        <a id="pickfiles" href="#">[Select files]</a>
                        <a id="uploadfiles" href="#">[Upload files]</a>
                    </div>
                  </div>
               </div>

Ошибка показана на следующем рисунке:

http://i.imgur.com/5t0sT.jpg (для просмотра в полном размере)

Я вижу, что здесь проблема с фильтрами файлов.Я запускаю примеры PLUpload.com в IE8, и он отлично работает во время выполнения Flash.

В других браузерах мой загрузчик работает отлично.Кроме того, я установил последнюю версию Flash для ВСЕХ браузеров (IE8, FF9, Chrome 16), но проблема настаивает на IE8.

ИСПРАВЛЕНО: НЕ вставляйте объект загрузки в div, который имеет visibility:hidden или display:none property.

Answer 1

Для всех, у кого такая же проблема, как у меня:

У меня был следующий HTML-код

<div class="container" style="display:none">
                  <div>Logo: </div>
                  <div style="clear"></div>
                  <div id="uploader">
                    <div id="runtime" class="right">
                        No runtime was found !
                    </div>
                    <div>
                        <a id="pickfiles" href="#">[Select files]</a>
                        <a id="uploadfiles" href="#">[Upload files]</a>
                    </div>
                  </div>
</div>

Класс container был создан как диалог

$(function()
{
$(".container").dialog({modal:true, width:400});
});

Поскольку мы знаем, что DIV изначально скрыт из-за dispaly:none (конечно, вы можете установить autoOpen:false в качестве новой опции в объекте диалога) и удалить стиль.

В IE8 (возможно, в более ранних и более поздних версиях) загрузчик не может быть хорошо реализован, если div скрыт (Возвращает вышеуказанную ошибку)

В Chrome и Firefox (я не тестирую эту проблему в Opera) работает нормально.

Итак, мой совет - избегать скрытых блоков (даже если вы хотите создать модальный диалог).

Я удалил стиль display:none и dialog объект из этого div и теперь очень хорошо работает в IE8.

Почему? Я не знаю, почему в IE экземпляр объекта не создается при запуске страницы, хотя в Firefox и Chrome экземпляр создавался нормально.

Answer 2

после того, как div показывает, сделайте это:

uploader.refresh();

У меня есть тест на моей странице, сработало!

Answer 3

Это тоже решило проблему:

#pickfiles{
    display:block;
}

или это:

$('#pickfiles').on("mouseover",function(){
                $(".plupload.flash").css({
                    left:$('#pickfiles').offset().left+'px',
                    top:$('#pickfiles').offset().top+'px'
                    });
                });

Answer 4

Эта ошибка решена с помощью:

Добавить "html4" к свойствам: "runtimes"

var uploader = new plupload.Uploader({
        runtimes : 'gears,html5,flash,silverlight,browserplus,**html4**',
        browse_button : 'pickfiles_<? echo  $tmpKey ?>',
        container : 'container_<? echo  $tmpKey ?>',
        max_file_size : '30mb',
        url : '/image/upload3',
        flash_swf_url : '/plupload/js/plupload.flash.swf',
        silverlight_xap_url : '/plupload/js/plupload.silverlight.xap',
        filters : [
            {title : "Image files", extensions : "jpg,gif,png,jpeg"},
            {title : "Zip files", extensions : "zip"}
        ],
        unique_names:false,
        multipart_params : {
            "tmpPath" : "<? echo $tmpPath ?>",
            "minWidth" : "<? if(isset($minWidth)) echo $minWidth; else echo 0; ?>",
            "minHeight" : "<? if(isset($minHeight)) echo $minHeight; else echo 0; ?>"
        }
    //  resize : {width : 390, height : 290, quality : 90}
    });

Удачи тебе !!!

Answer 5

Установите Microsoft Silverlight в вашей системе. Это решит проблему, и не забудьте дать пользователям сообщение об установке silverligth.