Bir kullanıcı bir web sayfasındaki bir dosyayı seçtiğinde, sadece dosya adını çıkarabilmek istiyorum.
Str.search işlevini denedim, ancak dosya adı şu şekilde olduğunda başarısız görünüyor: c: \ uploads \ ilike.this.file.jpg .
Uzantı olmadan sadece dosya adını nasıl çıkarabiliriz?
Yanıtlar:
<İnput type = "file"> dosyanızın bir yükleme kimliğine sahip olduğunu varsayarsak, bunun işe yarayacağını umuyoruz:
var fullPath = document.getElementById('upload').value;
if (fullPath) {
var startIndex = (fullPath.indexOf('\\') >= 0 ? fullPath.lastIndexOf('\\') : fullPath.lastIndexOf('/'));
var filename = fullPath.substring(startIndex);
if (filename.indexOf('\\') === 0 || filename.indexOf('/') === 0) {
filename = filename.substring(1);
}
alert(filename);
}filename = filename.substring(0, filename.lastIndexOf('.'));Çünkü 3'ten daha fazla karakter içeren uzantılarla onun yöntemi başarısız olacaktır, bu nedenle: .html, .jpeg vb.
var startIndex = Math.max(fullPath.lastIndexOf('\\'), fullPath.lastIndexOf('/')) + 1;
Dizeyi ({dosya yolu} / {dosyaadı}) bölmek ve dosya adını almak için aşağıdaki gibi bir şey kullanabilirsiniz:
str.split(/(\\|\/)/g).pop()"Pop yöntemi, dizideki son öğeyi kaldırır ve bu değeri çağırana döndürür."
Mozilla Geliştirici Ağı
Misal:
dan: "/home/user/file.txt".split(/(\\|\/)/g).pop()
alırsın: "file.txt"
var filename = filepath.replace(/^.*?([^\\\/]*)$/, '$1');
[\\/]. Dahası, dosya uzantısının da kaldırılması istendi. Eksiksiz bir çözüm için bkz: stackoverflow.com/a/32156800/19163
Günümüzde çok daha basit bir yol var:
var fileInput = document.getElementById('upload');
var filename = fileInput.files[0].name;fileInput.files.lengtharamadan önce kontrol edin .name.
var pieces = str.split('\\');
var filename = pieces[pieces.length-1];Sana, yani tüm uzantıları şerit istediğiniz varsayalım /tmp/test/somefile.tar.gziçin somefile.
Regex ile doğrudan yaklaşım:
var filename = filepath.match(/^.*?([^\\/.]*)[^\\/]*$/)[1];Düzenli ifade ve dizi işlemiyle alternatif yaklaşım:
var filename = filepath.split(/[\\/]/g).pop().split('.')[0];Bunun kendi versiyonunu yaptım. İşlevim, ondan istediğinizi çıkarmak için kullanılabilir, eğer hepsine ihtiyacınız yoksa, bazı kodları kolayca kaldırabilirsiniz.
<html>
<body>
<script type="text/javascript">
// Useful function to separate path name and extension from full path string
function pathToFile(str)
{
var nOffset = Math.max(0, Math.max(str.lastIndexOf('\\'), str.lastIndexOf('/')));
var eOffset = str.lastIndexOf('.');
if(eOffset < 0 && eOffset < nOffset)
{
eOffset = str.length;
}
return {isDirectory: eOffset === str.length, // Optionally: && nOffset+1 === str.length if trailing slash means dir, and otherwise always file
path: str.substring(0, nOffset),
name: str.substring(nOffset > 0 ? nOffset + 1 : nOffset, eOffset),
extension: str.substring(eOffset > 0 ? eOffset + 1 : eOffset, str.length)};
}
// Testing the function
var testcases = [
"C:\\blabla\\blaeobuaeu\\testcase1.jpeg",
"/tmp/blabla/testcase2.png",
"testcase3.htm",
"C:\\Testcase4", "/dir.with.dots/fileWithoutDots",
"/dir.with.dots/another.dir/"
];
for(var i=0;i<testcases.length;i++)
{
var file = pathToFile(testcases[i]);
document.write("- " + (file.isDirectory ? "Directory" : "File") + " with name '" + file.name + "' has extension: '" + file.extension + "' is in directory: '" + file.path + "'<br />");
}
</script>
</body>
</html>Aşağıdakileri çıktılar:
Şuna && nOffset+1 === str.lengtheklendi isDirectory:
Test senaryoları göz önüne alındığında, bu işlevin burada önerilen diğer yöntemlerle karşılaştırıldığında oldukça sağlam çalıştığını görebilirsiniz.
\\: \ ile ilgili yeni başlayanlar için not bir çıkış karakteridir, örneğin \ n yeni satır ve \ ta sekmesi anlamına gelir. Yazmayı mümkün kılmak için \ n, aslında \\ n yazmalısınız.
&& eOffset < nOffset).
Giriş : C:\path\Filename.ext
Çıkış :Filename
HTML kodunda, Dosya onChangedeğerini şu şekilde ayarlayın ...
<input type="file" name="formdata" id="formdata" onchange="setfilename(this.value)"/>Metin alanı kimliğinizin 'wpName' olduğunu varsayarsak ...
<input type="text" name="wpName" id="wpName">JavaScript
<script>
function setfilename(val)
{
filename = val.split('\\').pop().split('/').pop();
filename = filename.substring(0, filename.lastIndexOf('.'));
document.getElementById('wpName').value = filename;
}
</script>Yüksek oy alan yanıtların hiçbiri aslında "uzantısız dosya adını" sağlamaz ve diğer çözümler bu kadar basit bir iş için çok fazla koddur.
Bunun herhangi bir JavaScript programcısı için tek satırlık olması gerektiğini düşünüyorum. Bu çok basit bir düzenli ifade:
function basename(prevname) {
return prevname.replace(/^(.*[/\\])?/, '').replace(/(\.[^.]*)$/, '');
}İlk önce, varsa son eğik çizgiye kadar her şeyi soyun.
Ardından, varsa son periyottan sonra her şeyi çıkarın.
Basittir, sağlamdır, tam olarak isteneni uygular. Bir şey mi kaçırıyorum?
// HTML
<input type="file" onchange="getFileName(this)">
// JS
function getFileName(input) {
console.log(input.files[0].name) // With extension
console.log(input.files[0].name.replace(/\.[^/.]+$/, '')) // Without extension
}Yukarıdaki cevaplardan hiçbiri benim için işe yaramadı, işte devre dışı bırakılmış bir girişi dosya adıyla güncelleyen çözümüm:
<script type="text/javascript">
document.getElementById('img_name').onchange = function () {
var filePath = this.value;
if (filePath) {
var fileName = filePath.replace(/^.*?([^\\\/]*)$/, '$1');
document.getElementById('img_name_input').value = fileName;
}
};
</script>JQuery kullanıyorsanız o zaman
$("#fileupload").val();