ファイルをアップロードした後にページが更新中です

Question

ajax関数を使用してファイルをアップロードしようとしていますが、ファイルがアップロードされていますが、 ページが読み込まれないようにしてください。

私のHTMLコードは次のとおりです。

<form> 
    <input type="file" name="upl" id="upl" /><br />  
    <input type="submit" name="submit" id="submit" /> 
</form> 
<p id="res"></p> 

私のjsファイルのコードは次のとおりです。

$("#upl").on('change',function(e){ 
     e.preventDefault(); 
     e.stopPropagation(); 
     var file_data = $(this).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(php_script_response){ 
      $("#res").append(php_script_response); // display response from the PHP script, if any 
      if(php_script_response){ 
      return false; 
      } 
     } 
    }); 
}); 

と私のPHPファイルのコードは次のとおりです。

<?php 

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

?> 

この問題を解決するために助けてください。

Answer 1

フォームにアクションを追加する必要がないため、フォームを必要とせずにajaxを使用したいからです。