जावास्क्रिप्ट का उपयोग करके एक पूर्ण पथ से फ़ाइल नाम कैसे प्राप्त करें?


310

क्या कोई ऐसा तरीका है जिससे मैं पूर्ण पथ से अंतिम मान ('\' प्रतीक पर आधारित) प्राप्त कर सकता हूं?

उदाहरण:

C:\Documents and Settings\img\recycled log.jpg

इस मामले के साथ, मैं केवल recycled log.jpgजावास्क्रिप्ट में पूर्ण पथ से प्राप्त करना चाहता हूं ।

जवाबों:


696
var filename = fullPath.replace(/^.*[\\\/]/, '')

यह दोनों पथों में \ या को हैंडल करेगा


4
पर मैक OSX काम नहीं करता है, क्रोम का उपयोग कर, यह चरित्र के बाद \ निकल जाता है
पंकज Phartiyal

7
इस साइट के अनुसार, का उपयोग करने की तुलना replaceमें बहुत धीमा है substr, जिसका उपयोग इसके साथ किया जा सकता है lastIndexOf('/')+1: jsperf.com/replace-vs-substring
Nate

1
@nickf Nick, निश्चित नहीं है कि मैं कहाँ गलत हो रहा हूँ, लेकिन कोड मेरे लिए काम नहीं करता है जब फ़ाइल पथ में एक भी स्लैश हो। Fiddle, हालांकि `\\` के लिए , यह ठीक काम करता है।
शुभ

1
मैं बस अपना कंसोल पर इस भाग गया, और यह फ़ॉरवर्ड स्लैश के लिए एकदम सही काम किया: "/var/drop/foo/boo/moo.js".replace(/^.*[\\\/]/, '')रिटर्नmoo.js
vikkee

1
@ZloySmiertniy अच्छे ऑनलाइन रेगेक्स व्याख्याकारों के एक जोड़े हैं। rick.measham.id.au/paste/explain.pl?regex=%2F%5E । *% 5B% 5C% 5C% 5C% 2F% 5D% 2F और regexn.com/#%2F%5E । *% 5B। * % 5C% 5C% 5C% 2F% 5D% 2F को मदद करनी चाहिए। (लिंक यहाँ टूट रहे हैं, लेकिन एक टैब में कॉपी-पेस्ट करें और यह काम करेगा)
12

115

प्रदर्शन के लिए, मैंने यहाँ दिए गए सभी उत्तरों का परीक्षण किया:

var substringTest = function (str) {
    return str.substring(str.lastIndexOf('/')+1);
}

var replaceTest = function (str) {
    return str.replace(/^.*(\\|\/|\:)/, '');
}

var execTest = function (str) {
    return /([^\\]+)$/.exec(str)[1];
}

var splitTest = function (str) {
    return str.split('\\').pop().split('/').pop();
}

substringTest took   0.09508600000000023ms
replaceTest   took   0.049203000000000004ms
execTest      took   0.04859899999999939ms
splitTest     took   0.02505500000000005ms

और विजेता स्प्लिट और पॉप शैली का उत्तर है, बोबिन्स के लिए धन्यवाद !


4
मेटा चर्चा के अनुसार, कृपया अन्य उत्तरों में उचित उद्धरण जोड़ें। यह बेहतर ढंग से समझाने में मददगार होगा कि आपने रनटाइम का विश्लेषण कैसे किया।
jpmc26

इस संस्करण के साथ ही बेंचमार्क करने के लिए स्वतंत्र महसूस करें। मैक और विंडोज दोनों रास्तों का समर्थन करना चाहिए। path.split(/.*[\/|\\]/)[1];
tfmontague

2
परीक्षण गलत है। substringTest केवल आगे की स्लैश के लिए खोज करता है, निष्पादन - केवल बैकस्लैश के लिए जबकि दो शेष दोनों स्लैश को संभालते हैं। और वास्तविक परिणाम प्रासंगिक (अब) नहीं हैं। इसे देखें: jsperf.com/name-from-path
दुख

@ दुख कि लिंक अब मान्य नहीं है।
पोगोगोमेज़

88

Node.js में, आप पाथ के पार्स मॉड्यूल का उपयोग कर सकते हैं ...

var path = require('path');
var file = '/home/user/dir/file.txt';

var filename = path.parse(file).base;
//=> 'file.txt'

14
यदि Node.js का उपयोग कर रहे हैं, तो आप केवल basenameफ़ंक्शन का उपयोग कर सकते हैं :path.basename(file)
इलेक्ट्रोविर

66

रास्ता किस प्लेटफार्म से आता है? Windows पथ POSIX पथ से भिन्न हैं, OS OS से भिन्न हैं 9 पथ RISC से भिन्न हैं OS पथ भिन्न हैं ...

यदि यह एक वेब ऐप है जहां फ़ाइलनाम विभिन्न प्लेटफार्मों से आ सकता है तो कोई भी समाधान नहीं है। हालाँकि, पथ प्रदर्शक के रूप में '\' (विंडोज़) और '/' (लिनक्स / यूनिक्स / मैक और विंडोज पर एक विकल्प) दोनों का उपयोग करने के लिए एक उचित स्टैब है। यहाँ अतिरिक्त मज़ा के लिए एक गैर- RegExp संस्करण है:

var leafname= pathname.split('\\').pop().split('/').pop();

आप उस क्लासिक MacOS (<= 9) का उपयोग करना चाह सकते हैं जो बृहदान्त्र विभाजकों का उपयोग करता है (:), लेकिन मुझे ऐसे किसी भी ब्राउज़र के बारे में पता नहीं है जो अभी भी उपयोग में हो सकता है जो फ़ाइल के रूप में POSIX पथों के लिए MacOS पथों का अनुवाद नहीं करता है : ///path/to/file.ext
eyelidlessness

4
आप रिवर्स के बजाय पॉप () का उपयोग कर सकते हैं () [को ०]। यह मूल सरणी को भी संशोधित करता है, लेकिन यह आपके मामले में ठीक है।
चेतन शास्त्री

मैं सोच रहा हूं कि कैसे हम सिर्फ रास्ता पाने के लिए एक समकक्ष बना सकते हैं।
टॉड होर्स्ट

कुछ इस तरह var path = '\\Dir2\\Sub1\\SubSub1'; //path = '/Dir2/Sub1/SubSub1'; path = path.split('\\').length > 1 ? path.split('\\').slice(0, -1).join('\\') : path; path = path.split('/').length > 1 ? path.split('/').slice(0, -1).join('/') : path; console.log(path);
टॉड होर्स्ट

नामकरण " पत्ती नाम" से निर्देशिका / फ़ाइल संरचना नाम "ट्री" प्राप्त होता है, की पहली बात पेड़ है जड़ , पिछले रहे हैं पत्ते => फ़ाइल के नाम में आखिरी बात है पेड़ पथ => पत्ती :-)
Jave। वेब

29

Ates, आपका समाधान इनपुट के रूप में एक रिक्त स्ट्रिंग से सुरक्षा नहीं करता है। उस स्थिति में, यह विफल रहता है TypeError: /([^(\\|\/|\:)]+)$/.exec(fullPath) has no properties

bobince, यहाँ nickf का एक संस्करण है जो DOS, POSIX, और HFS पथ परिसीमन (और खाली तार) को संभालता है:

return fullPath.replace(/^.*(\\|\/|\:)/, '');

4
अगर हम PHP में इस जे एस कोड लिख रहे हैं, हम एक \ के लिए एक अतिरिक्त \ जोड़ने की जरूरत है
लेनिन राज Rajasekaran

17

जावास्क्रिप्ट कोड की निम्न पंक्ति आपको फ़ाइल नाम देगी।

var z = location.pathname.substring(location.pathname.lastIndexOf('/')+1);
alert(z);

10

निक के उत्तर की तुलना में अधिक संक्षिप्त नहीं है , लेकिन यह एक खाली स्ट्रिंग के साथ अवांछित भागों को बदलने के बजाय सीधे "अर्क" देता है:

var filename = /([^\\]+)$/.exec(fullPath)[1];

8

एक प्रश्न "एक्सटेंशन के बिना फ़ाइल का नाम प्राप्त करें" यहां देखें लेकिन उसके लिए कोई समाधान नहीं है। यहाँ बॉबी के समाधान से संशोधित समाधान है।

var name_without_ext = (file_name.split('\\').pop().split('/').pop().split('.'))[0];

6

और एक

var filename = fullPath.split(/[\\\/]/).pop();

यहाँ एक चरित्र वर्ग के साथ विभाजन की एक नियमित अभिव्यक्ति है दो वर्णों को '\' के साथ भाग जाना है

या विभाजित करने के लिए सरणी का उपयोग करें

var filename = fullPath.split(['/','\\']).pop();

यह जरूरत पड़ने पर किसी विभाजक को गतिशील रूप से धकेलने का तरीका होगा।
यदि fullPathआपके कोड में स्पष्ट रूप से एक स्ट्रिंग द्वारा सेट किया गया है तो उसे बैकस्लैश से बचने की आवश्यकता है !
पसंद"C:\\Documents and Settings\\img\\recycled log.jpg"


3

मैं उपयोग करता हूं:

var lastPart = path.replace(/\\$/,'').split('\\').pop();

यह अंतिम की जगह लेता है \इसलिए यह फ़ोल्डर्स के साथ भी काम करता है।


2
<script type="text/javascript">
    function test()
    {
        var path = "C:/es/h221.txt";
        var pos =path.lastIndexOf( path.charAt( path.indexOf(":")+1) );
        alert("pos=" + pos );
        var filename = path.substring( pos+1);
        alert( filename );
    }
</script>
<form name="InputForm"
      action="page2.asp"
      method="post">
    <P><input type="button" name="b1" value="test file button"
    onClick="test()">
</form>

1

पूरा जवाब है:

<html>
    <head>
        <title>Testing File Upload Inputs</title>
        <script type="text/javascript">

        function replaceAll(txt, replace, with_this) {
            return txt.replace(new RegExp(replace, 'g'),with_this);
        }

        function showSrc() {
            document.getElementById("myframe").href = document.getElementById("myfile").value;
            var theexa = document.getElementById("myframe").href.replace("file:///","");
            var path = document.getElementById("myframe").href.replace("file:///","");
            var correctPath = replaceAll(path,"%20"," ");
            alert(correctPath);
        }
        </script>
    </head>
    <body>
        <form method="get" action="#"  >
            <input type="file"
                   id="myfile"
                   onChange="javascript:showSrc();"
                   size="30">
            <br>
            <a href="#" id="myframe"></a>
        </form>
    </body>
</html>

1

विंडोज के लिए एक पूर्ण पथ के साथ-साथ GNU / Linux और UNIX निरपेक्ष पथ से फ़ाइलनाम निर्धारित करने के लिए अपनी परियोजना में शामिल करने के लिए थोड़ा फ़ंक्शन।

/**
 * @param {String} path Absolute path
 * @return {String} File name
 * @todo argument type checking during runtime
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
 * @example basename('/home/johndoe/github/my-package/webpack.config.js') // "webpack.config.js"
 * @example basename('C:\\Users\\johndoe\\github\\my-package\\webpack.config.js') // "webpack.config.js"
 */
function basename(path) {
  let separator = '/'

  const windowsSeparator = '\\'

  if (path.includes(windowsSeparator)) {
    separator = windowsSeparator
  }

  return path.slice(path.lastIndexOf(separator) + 1)
}

0
<html>
    <head>
        <title>Testing File Upload Inputs</title>
        <script type="text/javascript">
            <!--
            function showSrc() {
                document.getElementById("myframe").href = document.getElementById("myfile").value;
                var theexa = document.getElementById("myframe").href.replace("file:///","");
                alert(document.getElementById("myframe").href.replace("file:///",""));
            }
            // -->
        </script>
    </head>
    <body>
        <form method="get" action="#"  >
            <input type="file" 
                   id="myfile" 
                   onChange="javascript:showSrc();" 
                   size="30">
            <br>
            <a href="#" id="myframe"></a>
        </form>
    </body>
</html>

1
हालांकि यह कोड स्निपेट प्रश्न को हल कर सकता है, जिसमें स्पष्टीकरण सहित वास्तव में आपकी पोस्ट की गुणवत्ता में सुधार करने में मदद करता है। याद रखें कि आप भविष्य में पाठकों के लिए प्रश्न का उत्तर दे रहे हैं, और उन लोगों को आपके कोड सुझाव के कारणों का पता नहीं चल सकता है।
फेरीबीग

0

सफलतापूर्वक अपने प्रश्न के लिए स्क्रिप्ट, पूर्ण परीक्षण

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<p  title="text" id="FileNameShow" ></p>
<input type="file"
   id="myfile"
   onchange="javascript:showSrc();"
   size="30">


<script type="text/javascript">

function replaceAll(txt, replace, with_this) {
    return txt.replace(new RegExp(replace, 'g'), with_this);
}

function showSrc() {
    document.getElementById("myframe").href = document.getElementById("myfile").value;
    var theexa = document.getElementById("myframe").href.replace("file:///", "");
    var path = document.getElementById("myframe").href.replace("file:///", "");
    var correctPath = replaceAll(path, "%20", " ");
   alert(correctPath);
    var filename = correctPath.replace(/^.*[\\\/]/, '')
    $("#FileNameShow").text(filename)
}


0

यह समाधान 'फ़ाइल नाम' और 'पथ' दोनों के लिए बहुत सरल और सामान्य है।

const str = 'C:\\Documents and Settings\\img\\recycled log.jpg';

// regex to split path to two groups '(.*[\\\/])' for path and '(.*)' for file name
const regexPath = /^(.*[\\\/])(.*)$/;

// execute the match on the string str
const match = regexPath.exec(str);
if (match !== null) {
    // we ignore the match[0] because it's the match for the hole path string
    const filePath = match[1];
    const fileName = match[2];
}

आपके कोड में कुछ स्पष्टीकरण जोड़कर एक उत्तर की गुणवत्ता में सुधार किया जा सकता है। इस उत्तर की खोज करने वाले कुछ लोग कोडिंग या नियमित अभिव्यक्ति के लिए नए हो सकते हैं, और संदर्भ देने के लिए एक छोटा पाठ समझने में मदद करने के लिए एक लंबा रास्ता तय करेगा।
17

उम्मीद है कि यह तरीका बेहतर है :)
हिचम

-3
function getFileName(path, isExtension){

  var fullFileName, fileNameWithoutExtension;

  // replace \ to /
  while( path.indexOf("\\") !== -1 ){
    path = path.replace("\\", "/");
  }

  fullFileName = path.split("/").pop();
  return (isExtension) ? fullFileName : fullFileName.slice( 0, fullFileName.lastIndexOf(".") );
}

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.