Question

这是代码

JS

$(window).load(function(){
        //File Uploader
        function createUploader(){ 
          var uploader = new qq.FileUploader({
          element: document.getElementById('fileUploaderButton'),
          action: 'upload.php',
          debug: true
        }); 
        createUploader();       
}

创建上传者后的DOM

<button id="fileUploaderButton" style="border-radius: 5px 5px 5px 5px;">
    <div class="qq-uploader">
    <div class="qq-upload-drop-area" style="display: none;">
        <span>Drop files here to upload</span>
    </div>
    <div class="qq-upload-button" title="Upload photo" style="position: relative; overflow: hidden; direction: ltr;">
        Upload photo
        <input type="file" multiple="multiple" name="file" style="position: absolute; right: 0pt; top: 0pt; font-family: Arial; font-size: 118px; margin: 0pt; padding: 0pt; cursor: pointer; opacity: 0;">
        </div>
        <ul class="qq-upload-list"></ul>
    </div>
</button>

如果我点击“.qq-uploader”div，文件浏览器会弹出，但只能在Chrome中弹出。 #fileUploaderButton的光标是指针，但qq-uploader的id正常。 qq-uploader div小于按钮。在Chrome中，当鼠标悬停在qq-uploader上时，光标会发生变化。在Internet Explorer或Firefox中，它不会，即使Firebug显示该元素存在。

Answer 1

我有同样的问题并解决了它更改容器元素。如果您尝试在上传器中转换的DOM元素（在您的情况下为button#fileUploaderButton）是一个按钮，它将无法工作。如果你使用div或span它会起作用，或者至少它适用于我。在您的情况下，HTML：

<div id="fileUploaderButton">Upload</div>

和Javascript：

$(window).load(function(){
    function createUploader(){ 
      var uploader = new qq.FileUploader({
      element: document.getElementById('fileUploaderButton'),
      action: 'upload.php',
      debug: true
    }); 
    createUploader();       
}

valiums文件上传 - 适用于Chrome但不适用于Firefox和Internet Explorer

1 个答案: