2016-12-07 13 views
0

私は、画像をアップロードするためにblueignとcodeigniterを使用してPHPでWebサイトを開発しましたが、完全に動作していますが、画像のサイズ変更は機能しません。 main.jsに従います。Blueimp画像のサイズ変更に関する問題

$(function() { 
'use strict'; 

// Initialize the jQuery File Upload widget: 
$('#fileupload').fileupload({ 
    // Uncomment the following to send cross-domain cookies: 
    //xhrFields: {withCredentials: true}, 
    url: 'admin/upload/do_upload' 
}); 

// Enable iframe cross-domain access via redirect option: 
$('#fileupload').fileupload(
    'option', 
    'redirect', 
    window.location.href.replace(
     /\/[^\/]*$/, 
     '/cors/result.html?%s' 
    ) 
); 

if (window.location.hostname === 'blueimp.github.io') { 
    // Demo settings: 
    $('#fileupload').fileupload('option', { 
     url: '//jquery-file-upload.appspot.com/', 
     dataType: 'json', 
     // Enable image resizing, except for Android and Opera, 
     // which actually support image resizing, but fail to 
     // send Blob objects via XHR requests: 
     disableImageResize: /Android(?!.*Chrome)|Opera/ 
      .test(window.navigator && navigator.userAgent), 
     imageMaxWidth: 800, 
     imageMaxHeight: 800, 
     imageCrop: true // Force cropped images 
    }); 
    // Upload server status check for browsers with CORS support: 
    if ($.support.cors) { 
     $.ajax({ 
      url: 'admin/upload/do_upload', 
      type: 'HEAD' 
     }).fail(function() { 
      $('<div class="alert alert-danger"/>') 
       .text('Upload server currently unavailable - ' + 
         new Date()) 
       .appendTo('#fileupload'); 
     }); 
    } 
} else { 
    // Load existing files: 
    $('#fileupload').addClass('fileupload-processing'); 
    $.ajax({ 
     // Uncomment the following to send cross-domain cookies: 
     //xhrFields: {withCredentials: true}, 
     url: $('#fileupload').fileupload('option', 'url'), 
     dataType: 'json', 
     context: $('#fileupload')[0] 
    }).always(function() { 
     $(this).removeClass('fileupload-processing'); 
    }).done(function (result) { 
     $(this).fileupload('option', 'done') 
      .call(this, $.Event('done'), {result: result}); 
    }); 
} 

});

次のJSは、インポートした私の見解で

<script src="<?= base_url('libs/js/fileupload/jquery.min.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/vendor/jquery.ui.widget.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/tmpl.min.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/load-image.all.min.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/canvas-to-blob.min.js') ?>"></script> 
<script src="<?= base_url('libs/bootstrap/js/bootstrap.min.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/query.blueimp-gallery.min.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.iframe-transport.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.fileupload.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.fileupload-process.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.fileupload-image.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.fileupload-validate.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/jquery.fileupload-ui.js') ?>"></script> 
<script src="<?= base_url('libs/js/fileupload/main.js') ?>"></script> 

私は現在、テストのためにXAMPPを使用しています、私はif (window.location.hostname === 'localhost') {if (window.location.hostname === 'blueimp.github.io')を変更する必要があります。しかし、それはまだ動作しませんフォーラムでここに見ました。

私がアップロードするたびに、それはELSEで削除され、サイズ変更部分があるIFでは削除されません。間違いは何ですか?

ありがとうございます。画像をデバッグするための

+0

else条件で 'console.log(window.location.hostname)'を使用してください。 –

+0

ありがとう、私はローカルホストに変更することができ、管理者にURL /アップロード/ do_upload画像のサイズが変更されたように。しかしサムネイルは画面に表示されなくなりましたが、どこで設定する必要がありますか?ありがとうございました。 – user2733757

答えて

0

は他の条件で

使用console.log(window.location.hostname)をアップロードします。

の画像のパスをブラウザで確認して、ブラウザのIMAGE Urlに直接アクセスしてください。

次に、ブラウザにISPECT要素を使用して、ウェブサイトのサムネイル画像のパスを確認してください。

これがあなたの問題を解決することを願っています。

+0

@ user2733757は役に立ちますか? –

関連する問題