2011-10-27 10 views
1

ここではFirefoxとInternet Explorerの作品は、コードにvalumsファイルアップロード - Chromeでなく、

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が要素が存在することを示していますが、そうではありません。

+0

それが原因の可能性が 'フォントサイズ:118px;'。インラインで 'font-size:0px;'に変更してください。それが動作しているかどうかを確認します。 –

答えて

0

私は同じ問題があり、それを解決してコンテナ要素を変更しました。アップローダで変換しようとしている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();  
} 
関連する問題