jquery ajax를 사용하여 파일 업로드

jquery로 파일을 업로드하려고하는데 페이지를 새로 고치고 싶지 않습니다.jquery ajax를 사용하여 파일 업로드

일부 중복 질문을 읽었지만 문제가 해결되지 않았습니다.

내가 코드를 잘못 사용했는지 알려주십시오.

<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script> 
<script src="js/jquery.form.js" type="text/javascript"></script> 
<script src="js/myajax.js" type="text/javascript"></script>

html 코드 :

<form id="uploadpic" action="func/uploader.php" enctype="multipart/form-data" method="post" onsubmit="sendAjax('uploadpic','#image_place'); return false;"> 
<label for="UserImage" class="fright">new pic</label> 
<div class="file-input width-100"> 
    <input type="file" id="File1" class="choose-file" name="choose-file" onchange="javascript: document.getElementById('uploadpic').submit();" /> 
    <span class="file-button">- - - - -</span> 
</div> 
</form>

및 myajax.js :

function sendAjax(n,des,dataform){ 
    if(dataform==undefined) dataform = des; 
    $(dataform).animate({opacity:0.5},100); 
    var frm = $('#'+n); 
     $.ajax({ 
     type: frm.attr('method'), 
     url: frm.attr('action'), 
     data: frm.serialize(), 
     success: function (data) { 
     $(des).html(data); 
      $(dataform).animate({opacity:1},100); 
     } 
    }); 
    return false; 
}

덕분에 ...

출처

2013-05-23 mehran

이 ajaxform 플러그인을 사용하여 시도하십시오 (form 태그에서 핸들러를 제출에 제거). http://malsup.com/jquery/form/ –

실제 예 : http://jsfiddle.net/vishalvaishya/xh65S/ HTML5를 사용하므로 HTML5 호환 브라우저에서만 지원됩니다. irefox 4+, Google Chrome, IE10, Safari 5 이상. –

당신은 여기 ajaxForm submit() 기능을 사용해야합니다. 기본적으로 저는 RoR 개발자입니다. Javascript 부분을 변경해야합니다.

이

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#File1').change(function() { 
     $("#uploadpic").ajaxForm({ target: "#image_view" }).submit(); 
     return false; 
    }); 
}); 
</script> 

#image_view is just a div. where the response from ajax function can be loaded.

출처

2013-05-23 06:05:12 Jyothu

놀란 .. .. – mehran

jquery ajax를 사용하여 파일 업로드

답변

관련 문제