AjaxFileUpload는 비동기식 파일 업로드를 구현합니다(AjaxFileUpload.js 파일 다운로드 및 매개변수 소개).-PHP开发-php.cn

AjaxFileUpload는 비동기식 파일 업로드를 구현합니다(AjaxFileUpload.js 파일 다운로드 및 매개변수 소개).

高洛峰

풀어 주다： 2016-12-12 17:38:15

원래의

1402명이 탐색했습니다.

AjaxFileUpload는 더 나은 비동기식 파일 업로드를 달성하고 사용이 간단합니다.

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="http://www.phpddt.com/usr/themes/dddefault/jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="ajaxfileupload.js"></script>
    </head>
<script>
jQuery(function(){   
  $("#buttonUpload").click(function(){     
     //加载图标   
     /* $("#loading").ajaxStart(function(){
        $(this).show();
     }).ajaxComplete(function(){
        $(this).hide();
     });*/
      //上传文件
    $.ajaxFileUpload({
        url:&#39;upload.php&#39;,//处理图片脚本
        secureuri :false,
        fileElementId :&#39;fileToUpload&#39;,//file控件id
        dataType : &#39;json&#39;,
        success : function (data, status){
            if(typeof(data.error) != &#39;undefined&#39;){
                if(data.error != &#39;&#39;){
                    alert(data.error);
                }else{
                    alert(data.msg);
                }
            }
        },
        error: function(data, status, e){
            alert(e);
        }
})
return false;
  }) 
})
</script>
    <body>
        <input id="fileToUpload" type="file" size="20" name="fileToUpload" class="input">
        <button id="buttonUpload">上传</button>
    </body>
</html>

로그인 후 복사

업로드는 매개변수도 전달할 수 있습니다.

var data = { name: &#39;my name&#39;, description: &#39;short description&#39; } 
    $.ajaxFileUpload({
        url: &#39;upload.php&#39;,
        secureuri: false,
        data: data,
        fileElementId: &#39;fileToUpload&#39;,
        dataType: &#39;json&#39;,
        success: function (data) {
            alert(data.msg);
 
        },
        error: function (data) {
            alert("error");
        }
    });

로그인 후 복사

주요 매개변수 설명:
1, URL 표현 파일 업로드 작업의 파일 경로를 처리합니다. 위와 같이 브라우저에서 URL에 직접 액세스할 수 있는지 테스트할 수 있습니다. upload.php
2, fileElementId는 위와 같이 파일 도메인 ID를 나타냅니다. fileToUpload
3 , secureuri가 보안 제출을 활성화하는지 여부, 기본값은 false입니다
4, dataType 데이터, 일반적으로 javascript의 원래 생태인 json을 선택합니다
5, 제출 성공 후 처리 기능
6, 오류 제출 실패 처리 기능

해당 오류 메시지를 알아야 합니다

1, 구문 오류: 누락; 앞에 문 오류
이 오류가 발생하면 URL 경로에 액세스할 수 있는지 확인해야 합니다

2, SyntaxError: 구문 오류
이 오류가 발생하면 제출 작업을 처리하는 PHP 파일에 구문 오류가 있는지 확인해야 합니다

3, SyntaxError: 잘못된 속성 ID 오류
이 오류가 발생하면 속성 ID가 존재하는지 확인해야 합니다

4. XML 표현식 오류에서 구문 오류: 누락 }
이 오류가 발생하면 파일 도메인 이름이 있는지 확인해야 합니다. 일치하거나 존재하지 않습니다

5. 기타 사용자 정의 오류
$error 변수를 직접 사용할 수 있습니다. 각 매개변수가 올바른지 확인하는 인쇄 방법은 위의 잘못된 오류 메시지보다 훨씬 편리합니다.