JQUERY画像アップロードの問題

Question

$(document).ready(function() { 
      var myUpload = $('#upload_link').upload({ 
       name: 'image', 
       action: '<?=$image_handling_file?>', 
       enctype: 'multipart/form-data', 
       params: {upload:'Upload'}, 
       autoSubmit: true, 
       onSubmit: function() { 
        $('#upload_status').html('').hide(); 
        loadingmessage('Veuillez patienter...', 'show'); 
       }, 
       onComplete: function(response) { 
        loadingmessage('', 'hide'); 
        response = unescape(response); 
        var response = response.split("|"); 
        var responseType = response[0]; 
        var responseMsg = response[1]; 
        if(responseType=="success"){ 
         var current_width = response[2]; 
         var current_height = response[3]; 
         //display message that the file has been uploaded 
         $('#upload_status').show().html('<p><h2>Veuillez redimensionner votre image ci-dessous, puis cliquez Sauvegarder</h2></p>'); 
         //put the image in the appropriate div 
         $('#uploaded_image').html('<img src="images/news/'+responseMsg+'" id="thumbnail" alt="Create headline image" /><center><div style="width:<?php echo $thumb_width;?>px; height:<?php echo $thumb_height;?>px; margin: 10px; padding: 10px; background: #F4F4F4; border-radius: 10px; moz-border-radius: 10px; border:1px #e5e5e5 solid;"><div style="overflow:hidden; width:<?php echo $thumb_width;?>px; height:<?php echo $thumb_height;?>px;"><img src="images/news/'+responseMsg+'" id="thumbnail_preview" alt="Thumbnail Preview" /></div></div></center>') 
         //find the image inserted above, and allow it to be cropped 
         $('#uploaded_image').find('#thumbnail').imgAreaSelect({ aspectRatio: '1:<?php echo $thumb_height/$thumb_width;?>', onSelectChange: preview }); 
         //display the hidden form 
         $('#thumbnail_form').show(); 
         $('#upload_par').hide(); 
        }else if(responseType=="error"){ 
         $('#upload_status').show().html('<h1>Erreur</h1><p>'+responseMsg+'</p>'); 
         $('#uploaded_image').html(''); 
         $('#thumbnail_form').hide(); 
        }else{ 
         $('#upload_status').show().html('<h1>Erreur</h1><p>Veuillez réessayer</p>'+response); 
         $('#uploaded_image').html(''); 
         $('#thumbnail_form').hide(); 
        } 
       } 
      }); 
}); 


<div id="upload_par"><a id="upload_link" href="#"><button type="button" class="btn" style="display:block;">Choisir une image</button></a></div> 

私のJQUERYの問題は何ですか？

クロームの開発者ツールは私にこれらのエラーの詳細を与える：

Uncaught TypeError: Object [object Object] has no method 'upload' (anonymous function) f.Callbacks.njquery.js:2

f.Callbacks.o.fireWithjquery.js:2

e.extend.readyjquery.js:2

c.addEventListener.B

Answer 1

jQueryので.upload()ようには機能はありません、あなたの代わりに.submit()を使用する場合があります。

Answer 2

実際にとして、バーディエルには、upload()のようなものはありません。 thisのようなものを使用して、再利用可能にしてください。hereのアップローダーはとてもシンプルでカスタムが簡単です。それが役に立てば幸い。

だけローダーの最終的なコードは次のようなものになるだろう：

$('#imageform').bind('submit', function(e) { 
      e.preventDefault(); // <-- important 
      $(this).ajaxSubmit({ 
       target: '#preview', 
       success: function() { 
       $('#file').val($('#newimg').attr("src")); 
       }    
      }); 
     }).submit(); 

そして、すべての魔法は、デ・アップロードを行うためにajaxSubmitとPHPファイルで処理することができます。