>

실제로 내 업로드 파일을 포함하는 양식을 PHP 업로드 처리 파일로 보내 $.post를 사용하여 비동기 적으로 사진을 업로드하고 싶습니다 . .serializeArray()  필요하지 않습니다. 어떤 방법으로 제안 할 수 있습니까?

HTML :

<form action="upload1.php" method="post" id="usrform" enctype="multipart/form-data" >
        <div class="input-group text-center ">
        <input type="file" class="form-control btn btn-default" name="fileToUpload" id="fileToUpload"data-toggle="tooltip" data-placement="left" title="Choose your video to upload by clicking on the choose file  button"></div>
        <br><div class="form-group"><strong><span class="glyphicon glyphicon-pencil" style="font-size:13px" ></span> Caption:</strong> <input form="usrform" name="post"id="textarea1" type="text" class="form-control" name="image" placeholder="Write something" data-toggle="tooltip" data-placement="top" title="">
        </div>
        <div class="text-right">
        <button type="submit" id="sub"class="btn btn-primary">POST</button>
        </div></form>

자바 스크립트 :

$('#sub').click(function(){$.post('porthome_.php',$("#usrform").serializeArray(),function(info){
            clearInput();$("#myModal1 .close").click();
           });});
           $('#usrform').submit(function(){return false;});

PHP :

<?php
 require("../includes/config.php"); 
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
// Check if image file is a actual image or fake image
if(isset($_POST["submitfile"])) {
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        //apologize( "File is an image - " . $check["mime"] . ".","portimage_.php","Error");
        $uploadOk = 1;
    } else {
        apologize( "File is not an image.","portimage_.php","Error");
        $uploadOk = 0;
    }
}
// Check if file already exists
if (file_exists($target_file)) {
    apologize( "Sorry, file already exists.Try changing the name of your image file.","portgallery_.php","Error");
    $uploadOk = 0;
}
// Check file size
if ($_FILES["fileToUpload"]["size"] > 5000000) {
    apologize( "Sorry, your file is too large.","portimage_.php","Error");
    $uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
    apologize( "Sorry, only JPG, JPEG, PNG & GIF files are allowed.","portimage_.php","Error");
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    apologize( "Sorry, your file was not uploaded.","portimage_.php","Error");
// if everything is ok, try to upload file
} else {
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {

    apologize( "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.","porthome_.php","Success");
    } else {
        apologize( "Sorry, there was an error uploading your file.","portimage_.php","Error");
    }
}?>

다른 방법이 있다면 감사하겠습니다.


  • 답변 # 1

    jQuery를 사용하지 않으므로 $.post() 에 대한 실제 지침을 제공 할 수 없습니다  지금까지 사용한 함수이지만 바닐라 자바 ​​스크립트에서는 다음과 같이 할 수 있습니다.

    <form action="upload1.php" method="post" id="usrform" enctype="multipart/form-data" >
        <div class="input-group text-center ">
            <input type="file" class="form-control btn btn-default" name="fileToUpload" id="fileToUpload"data-toggle="tooltip" data-placement="left" title="Choose your video to upload by clicking on the choose file  button">
        </div>
        <br>
        <div class="form-group">
            <strong><span class="glyphicon glyphicon-pencil" style="font-size:13px" ></span> Caption:</strong>
            <input form="usrform" name="post"id="textarea1" type="text" class="form-control" name="image" placeholder="Write something" data-toggle="tooltip" data-placement="top" title="">
        </div>
        <div class="text-right">
            <button type="submit" id="sub" class="btn btn-primary">POST</button>
        </div>
    </form>
    <script>
        function uploadfiles(e){
            var data=new FormData( document.getElementById('usrform') );
            var xhr=new XMLHttpRequest();
            xhr.onload=function(e){
                /* You probably would want to do more than popup an alert here! */
                alert( this.response );
            }
            xhr.onerror=function(e){
                alert(e);
            }
            xhr.open( 'POST', 'upload1.php', true );
            xhr.send( data );
        }
        document.addEventListener('DOMContentLoaded',function(){
            document.getElementById('sub').onclick=uploadfiles;
        },false );
    </script>
    
    

  • 이전 openstack - 정보 novaconsoleauthmanager [req-db1e6559-91c4-4412-b908-c323aae1161a - -:--] 토큰 확인 : bb41fdbe-5cf3-4627-9ba1-7d48849
  • 다음 c# - wpf - 프로그래밍 방식으로 사용자 정의 컨트롤 변경