jQuery的檢查文件類型輸入上傳文件名

Question

我試圖通過檢查使用JQuery給出的文件名格式的文件名..

這是我的代碼：

<input class="" name="myfile" id="myfile" type="file" multiple="false" data-value="">

我的jQuery腳本：

function checkFileName(filename, file_id){ 
    var must_filename; 

    must_filename = jQuery(file_id).attr('data-value').split('.').slice(0, 2).join('.'); 
    jQuery('.file_err_det').remove(); 
    alert(must_filename + ' != ' + filename); 
    // filename value is always null? 
    if(must_filename != filename){   
     alert('Filename is not valid! Please follow the format and upload it again'); 
     jQuery(file_id).val(''); 
    } 
} 

jQuery('#myfile').blur(function() { 
    var this_filename = jQuery(this).val().split('.').slice(0, 2).join('.'); 
    checkFileName(this_filename, '#myfile'); 
    alert(this_filename); // this returns null? I dont know why.. 
}); 

但似乎值this_filename爲空。我正在使用blur，有什麼我可以用來檢查jQuery('#myfile').val()？

Answer 1

參見Using files from web applications

文件API使得能夠訪問包含文件列表文件表示由用戶選擇的文件 對象。

如果用戶只選擇一個文件，那麼只需要 考慮列表中的第一個文件。

使用經典DOM選擇器訪問一個選定的文件：

var selectedFile = $('#input').get(0).files[0];

var selectedFile = $('#input')[0].files[0];

---

：

var selectedFile = document.getElementById('input').files[0];

使用jQuery選擇訪問一個選定的文件

嘗試利用change事件

$("#myfile").on("change", function(e) { 
 
    var file = e.target.files[0]; 
 
    console.log(file, file.name); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> 
 
</script> 
 
<input class="" name="myfile" id="myfile" type="file" multiple="false" data-value="">