如果使用ajax jquery文件上传文件上传文件,如何在php中获取上传的文件名

时间:2017-06-16 11:05:46

标签: javascript php jquery ajax file-upload

这是一个简单的文件上传脚本。我只需要我在php部分上传的文件的名称,因为我需要上传文件[及其路径]以将其插入数据库。 这是一个脚本。

的index.html

<form enctype="multipart/form-data" id="form1">
    <input name="file" type="file" id="id1" />
    <input type="button" value="Upload" />
</form>
<progress></progress>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(':file').on('change', function() {
    var file = this.files[0];
    if (file.size > 10024000000) {
        alert('max upload size is 1k')
    }
    // Also see .name, .type
});
</script>
<script>
$(':button').on('click', function() {
$.ajax({
        // Your server script to process the upload
        url: 'upload.php',
        type: 'POST',
        // Form data
        data: new FormData($('form')[0]),
        // Tell jQuery not to process data or worry about content-type
        // You *must* include these options!
        cache: false,
        contentType: false,
        processData: false,

        // Custom XMLHttpRequest
        xhr: function() {
            var myXhr = $.ajaxSettings.xhr();
            if (myXhr.upload) {
                // For handling the progress of the upload
                myXhr.upload.addEventListener('progress', function(e) {
                    if (e.lengthComputable) {
                        $('progress').attr({
                            value: e.loaded,
                            max: e.total,
                        });
                    }
                } , false);
            }
            return myXhr;
        },
    });
});
</script>

upload.php的

<?php
move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$_FILES['file']['name']);
$name = $_FILES['file']['tmp_name'];
echo $name;//i tried this but i know as i uploaded file using ajax it will not work

 ?>

2 个答案:

答案 0 :(得分:1)

我认为你可以在PHP代码中获取路径 这样做

$info = pathinfo($_FILES['userFile']['name']);
$ext = $info['extension']; // get the extension of the file
$newname = "newname.".rand(0,999).$ext;
$target = 'images/'.$newname;
move_uploaded_file( $_FILES['userFile']['tmp_name'], $target)

此处 $ target 包含您可以存储在我们的数据库中的文件路径。

答案 1 :(得分:1)

对于sucess函数的实现,请使用此代码。

JS:

$(':button').on('click', function() {
$.ajax({
        // Your server script to process the upload
        url: 'upload.php',
        type: 'POST',
        // Form data
        data: new FormData($('form')[0]),
        // Tell jQuery not to process data or worry about content-type
        // You *must* include these options!
        cache: false,
        contentType: false,
        processData: false,

        // Custom XMLHttpRequest
        xhr: function() {
            var myXhr = $.ajaxSettings.xhr();
            if (myXhr.upload) {
                // For handling the progress of the upload
                myXhr.upload.addEventListener('progress', function(e) {
                    if (e.lengthComputable) {
                        $('progress').attr({
                            value: e.loaded,
                            max: e.total,
                        });
                    }
                } , false);
            }
            return myXhr;
        },
         success: function(data)
        {
         alert(data);//Note that sometimes ajax misinterprets the data that is returned. To not have this problem, declare the type of data you expect to receive.
        }
    });
    });

PHP:

move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$_FILES['file']['name']);
$name = $_FILES['file']['tmp_name'];
echo $name;

如果要发回多个值,请使用Json编码发送回数据。

此代码:

PHP:

move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$_FILES['file']['name']);
$name = $_FILES['file']['tmp_name'];
$path = 'uploads/'.$_FILES['file']['name'];
echo json_encode(array(
                'name'=> $name,
                'path'=> $path
));

JS:

 ...
  success: function(data){
    alert("Name: "+data.name);
    alert("Path: "+data.path);
  }

请注意,有时ajax会错误解释返回的数据。要避免此问题,请声明您希望接收的数据类型。