147

ユーザーが Web ページでファイルを選択したときに、ファイル名だけを抽出できるようにしたいと考えています。

str.search 関数を試してみましたが、ファイル名がc:\uploads\ilike.this.file.jpgのようなものだと失敗するようです。

拡張子なしでファイル名だけを抽出するにはどうすればよいですか?

4

15 に答える 15

227

文字列 ({filepath}/{filename}) を分割してファイル名を取得するには、次のようなものを使用できます。

str.split(/(\\|\/)/g).pop()

「pop メソッドは、配列から最後の要素を削除し、その値を呼び出し元に返します。」
Mozilla 開発者ネットワーク

例：

から："/home/user/file.txt".split(/(\\|\/)/g).pop()

あなたが得る："file.txt"

于 2012-02-10T21:15:01.773 に答える
145

あなたの<input type="file" >がアップロードの id を持っていると仮定すると、うまくいけばうまくいくはずです:

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);
}
于 2009-05-13T12:24:23.817 に答える
130

今日では、はるかに簡単な方法があります。

var fileInput = document.getElementById('upload');   
var filename = fileInput.files[0].name;
于 2016-11-05T14:52:47.430 に答える
8

すべての拡張子を削除したい、/tmp/test/somefile.tar.gzつまりsomefile.

正規表現による直接アプローチ:

var filename = filepath.match(/^.*?([^\\/.]*)[^\\/]*$/)[1];

正規表現と配列操作による代替アプローチ:

var filename = filepath.split(/[\\/]/g).pop().split('.')[0];
于 2015-08-22T13:41:36.683 に答える
8 
var pieces = str.split('\\');
var filename = pieces[pieces.length-1];
于 2009-05-13T12:20:03.933 に答える
4

私はちょうどこれの私自身のバージョンを作りました。私の関数は、そこから必要なものを抽出するために使用できます。すべてが必要ない場合は、コードを簡単に削除できます。

<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>

以下を出力します。

  • 「testcase1」という名前のファイルの拡張子は「jpeg」で、ディレクトリは「C:\blabla\blaeobuaeu」にあります。
  • 「testcase2」という名前のファイルの拡張子は「png」で、ディレクトリは「/tmp/blabla」です。
  • 「testcase3」という名前のファイルの拡張子は「htm」で、ディレクトリは「」です。
  • 'Testcase4' という名前のディレクトリの拡張子: '' は、ディレクトリ: 'C:' にあります。
  • 'fileWithoutDots' という名前のディレクトリの拡張子は次のとおりです: '' は次のディレクトリにあります: '/dir.with.dots'
  • 名前が '' のディレクトリには拡張子があります: '' はディレクトリにあります: '/dir.with.dots/another.dir'

に&& nOffset+1 === str.length追加isDirectory:

  • 「testcase1」という名前のファイルの拡張子は「jpeg」で、ディレクトリは「C:\blabla\blaeobuaeu」にあります。
  • 「testcase2」という名前のファイルの拡張子は「png」で、ディレクトリは「/tmp/blabla」です。
  • 「testcase3」という名前のファイルの拡張子は「htm」で、ディレクトリは「」です。
  • 'Testcase4' という名前のディレクトリの拡張子: '' は、ディレクトリ: 'C:' にあります。
  • 'fileWithoutDots' という名前のディレクトリの拡張子は次のとおりです: '' は次のディレクトリにあります: '/dir.with.dots'
  • 名前が '' のディレクトリには拡張子があります: '' はディレクトリにあります: '/dir.with.dots/another.dir'

テストケースを考えると、ここで提案されている他の方法と比較して、この関数が非常に堅牢に機能することがわかります。

\\ に関する初心者向けの注意: \ はエスケープ文字です。たとえば、\n は改行と \ta タブを意味します。\n を書き込めるようにするには、実際に \\n と入力する必要があります。

于 2012-05-10T16:38:56.887 に答える
3

非常に支持された回答はどちらも実際には「拡張子のないファイル名のみ」を提供しておらず、他のソリューションはそのような単純な仕事にはコードが多すぎます。

これは、JavaScript プログラマーにとってワンライナーであるべきだと思います。これは非常に単純な正規表現です。

function basename(prevname) {
    return prevname.replace(/^(.*[/\\])?/, '').replace(/(\.[^.]*)$/, '');
}

最初に、最後のスラッシュがある場合はそれまで削除します。

次に、最後のピリオドの後にあれば、それを取り除きます。

シンプルで堅牢で、求められていることを正確に実装します。何か不足していますか？

于 2016-05-21T19:45:02.420 に答える