jQueryを使って画像をアップロードするには？

JSとindex.phpファイルを添付しました。このコードはイメージでは機能しませんが、タイプテキストでは正しく動作しています。私は非常に多くを検索しましたが、jQueryで画像をアップロードする方法は得られませんでした。jQueryを使って画像をアップロードするには？

index.phpファイル：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <title><?= TITLE . ' | ' . ucfirst($page); ?></title> 
     <!-- Tell the brow form_groupser to be responsive to screen width --> 
     <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> 
     <?php include('inc/css-inc.php'); ?> 
    </head> 
    <body> 
     <div class="row form_group"> 
      <div for="inputName" class="col-sm-2 control-div">Image A. </div> 
      <div class="col-sm-4"> 
       <input type="file" class="form-control" id="qimage" name="imga" onchange="un(this.value)"> 
      </div> 
      <button type="button" onClick="return savequestion()" id="savequestion" class="btn btn-info pull-right"><?= $act; ?></button><!--</form>--> 
      <!-- jQuery 2.1.4 --> 
      <script src="plugins/jQuery/jQuery-2.1.4.min.js"></script> 
      <!-- Bootstrap 3.3.5 --> 
      <script src="bootstrap/js/bootstrap.min.js"></script> 
    </body> 
</html>

JSファイル

$('#savequestion').click(function() { 
    var qimage1 = $('#qimage').prop('files')[0]; 
    var form_data = new FormData(); 
    form_data.append('qimage', qimage1); 
    form_data.append('mod', mod); 
    form_data.append('req', req); 
    $.ajax({ 
     url: 'common_process.php', 
     dataType: 'text', 
     cache: false, 
     contentType: false, 
     processData: false, 
     data: form_data, 
     type: 'POST', 
     success: function (data) { 
      alert(data); 
     } 
    }); 
});

出典

2016-10-27 shiv pratap

はこれを試してみてください：

HTML：

<input id="pic" type="file" name="pic" /> 
<button id="upload">Upload</button>

のjQuery：

$('#upload').on('click', function() { 
     var file_data = $('#pic').prop('files')[0]; 
     var form_data = new FormData(); 
     form_data.append('file', file_data); 

     $.ajax({ 
       url   : 'upload.php',  // point to server-side PHP script 
       dataType : 'text',   // what to expect back from the PHP script, if anything 
       cache  : false, 
       contentType : false, 
       processData : false, 
       data  : form_data,       
       type  : 'post', 
       success  : function(output){ 
        alert(output);    // display response from the PHP script, if any 
       } 
     }); 
     $('#pic').val('');      /* Clear the file container */ 
    });

PHPの：

if ($_FILES['file']['error'] > 0){ 
     echo 'Error: ' . $_FILES['file']['error'] . '<br>'; 
    } 
    else { 
     if(move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name'])) 
     { 
      echo "File Uploaded Successfully"; 
     } 
    }

これは、 "アップロード" フォルダにファイルをuloadます。また、フォルダの書き込み許可を確認します。

出典

2016-10-27 05:48:56

なし '

はい、テストコード –

ですが、私は同じコードを使用しています。おそらく私のコードは構文ミスを持っています....ありがとう –

jQueryを使って画像をアップロードするには？

答えて

関連する問題