如何在JavaScript中将PHP文件名分配为变量值？

Question

I use this html5 script in order to get file information in my php form. What I want is not to upload the file but only get the filename without uploading the file. Is it possible?

Here is the script :

<script>
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object

// files is a FileList of File objects. List some properties.
var output = [];
for (var i = 0, f; f = files[i]; i++) {
  output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
              f.size, ' bytes, last modified: ',
              f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
              '</li>');
 }
document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
}

document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>

Answer 1

No, you can't know the file name without uploading it and checking $_FILES array.
You can however issue an AJAX request that will upload the file and return the filename so you can add it in your views

Answer 2

You already have filename in f.name javascript variable. If you want to send it to server, just put it in a hidden input inside your form. Or you can send this value using ajax request.

Answer 3

Given the following form:

<form name="myForm" action="send.php">
    <input type="file" id="fileSelect">
    <input type="hidden" name="filename">
    <input type="submit">
</form>

To stop the file actually being uploaded, don't give the file input field a name attribute. Instead, you create a hidden input field, and when the user selects a file, populate that field with the file name, for example:

<script>
    var fileSelect = document.getElementById('fileSelect');

    var handleFileSelect = function(e) {
        var files = e.target.files;
        if(files.length === 1) {
            document.forms.myForm.filename.value = files[0].name;
        }
    };

    fileSelect.addEventListener('change', handleFileSelect, false);
</script>

Now when the user submits the form, you can get the filename using $_GET['filename'] .