2011-10-10 19 views
32

मैं शुद्ध जावास्क्रिप्ट में एक टेक्स्ट एडिटर पर काम कर रहा हूं। मुझे यह पसंद है कि जब उपयोगकर्ता 'सेव' बटन पर क्लिक करता है, तो संपादक फ़ाइल डाउनलोड करता है।फ़ाइल नाम के साथ फ़ाइल जावास्क्रिप्ट सहेजें

uriContent = "data:application/octet-stream," + encodeURIComponent(codeMirror.getValue()); 
newWindow=window.open(uriContent, 'filename.txt'); 

फ़ाइल डाउनलोड, लेकिन समस्या यह है कि फ़ाइल 'डाउनलोड' नाम दिया जाता है: मैं पहले से ही इस आंशिक रूप से काम कर रहा है।

प्रश्न: मैं फ़ाइल के नाम को जो कुछ भी चाहता हूं, उसे बदलने के लिए कैसे बदल सकता हूं, उदाहरण के लिए filename.txt?

+0

@zzzzBov मुझे लगता है कि यह उत्तर उस लिंक से बेहतर है जिसे आप लिंक करते हैं क्योंकि यह वास्तव में बताई गई समस्या का समाधान दिखाता है। – Deviljho

+0

@ एड्रियान सल्गाडो, जो इस सवाल को कम डुप्लिकेट नहीं बनाता है, हालांकि 2 साल पहले करीब मतदान हुआ था। जैसा कि आप देख सकते हैं कि वास्तव में इस प्रश्न को बंद करने के लिए पर्याप्त समर्थन नहीं था। यदि आपको लगता है कि दूसरे प्रश्न का बेहतर जवाब होना चाहिए, तो मैं एक जोड़ने की सलाह देता हूं। – zzzzBov

+0

अभी तक कोई अच्छा जवाब नहीं लग रहा है! मुझे लगता है कि जावास्क्रिप्ट विंडो ऑब्जेक्ट में यह सिर्फ एक छोटा सा ब्लैकहोल है! मेरे पास एक ही चिंता है: मेरा कोड उस फ्लाई पर फ़ाइल खोलने जा रहा है जिसमें रिपोर्ट है लेकिन फ़ाइल नाम वह नहीं है जो मेरा कोड परिभाषित करता है। मुझे उपयोगकर्ता को href पर क्लिक करने और फ़ाइल डाउनलोड करने की आवश्यकता नहीं है। –

उत्तर

23

अपने "सहेजें" बटन को एंकर लिंक के साथ बदलें और नया download गतिशील रूप से विशेषता सेट करें। क्रोम और फ़ायरफ़ॉक्स में काम करता है:

var d = "ha"; 
$(this).attr("href", "data:image/png;base64,abcdefghijklmnop").attr("download", "file-" + d + ".png"); 

यहाँ नाम आज की तारीख के रूप में सेट के साथ एक काम कर उदाहरण है: http://jsfiddle.net/Qjvb3/

यहाँ एक संगतता तालिका download विशेषता के लिए: http://caniuse.com/download

+1

डाउनलोड विशेषता ब्राउज़र समर्थन http://caniuse.com/#feat=download – jcubic

+0

उपरोक्त के रूप में, सफारी और आईई में कोई डाउनलोड विशेषता समर्थन नहीं है। – LT86

5

इस तरह filename संपत्ति का उपयोग करें:

uriContent = "data:application/octet-stream;filename=filename.txt," + 
       encodeURIComponent(codeMirror.getValue()); 
newWindow=window.open(uriContent, 'filename.txt'); 

संपादित करें:

जाहिर है, वहाँ यह करने के लिए कोई विश्वसनीय तरीका है। देखें: Is there any way to specify a suggested filename when using data: URI?

+0

हम्म, मैंने कोशिश की और यह अभी भी 'डाउनलोड' नाम की एक फ़ाइल डाउनलोड कर रहा है। यह मेरा कोड अभी है: 'uriContent =" डेटा: एप्लिकेशन/ऑक्टेट-स्ट्रीम; filename = filename.txt, "+ encodeURIComponent (codeMirror.getValue()); newWindow = window.open (uriContent, 'filename.txt'); ' – skimberk1

+2

फ़ायरफ़ॉक्स में किए गए ब्राउज़र परीक्षण के बिट के लिए काम नहीं कर रहा है; क्या यह एक अलग ब्राउज़र में एक सुविधा है? [विकिपीडिया का उल्लेख है कि डेटा यूआरएल में फ़ाइल नाम नहीं ले सकते हैं] (http://en.wikipedia.org/wiki/Data_URI_scheme#Disadvantages)। – zzzzBov

+0

हम्म ठीक है, वैसे भी जवाब के लिए धन्यवाद! – skimberk1

13
function saveAs(uri, filename) { 
    var link = document.createElement('a'); 
    if (typeof link.download === 'string') { 
     document.body.appendChild(link); // Firefox requires the link to be in the body 
     link.download = filename; 
     link.href = uri; 
     link.click(); 
     document.body.removeChild(link); // remove the link when done 
    } else { 
     location.replace(uri); 
    } 
} 
+0

आपने मेरी जिंदगी बचाई है। धन्यवाद –

संबंधित मुद्दे