क्रोम में फ़ाइल अपलोड के दौरान 'रद्द करें' मारना मूल्य साफ़ करता है

Question

मैं एक साधारण HTML प्रकार = "फ़ाइल" इनपुट के साथ काम कर रहा हूं, और मुझे क्रोम में कोई समस्या है। विशेष रूप से, जब आप किसी फ़ाइल को ब्राउज़ करते हैं और चुनते हैं, तो यह मान बचाता है। हालांकि, यदि आप पुनः ब्राउज़ करते हैं, तो रद्द करें दबाएं, यह मान को साफ़ कर देगा।

एचटीएमएल सरल है:

<input type="file"> 

यहाँ एक सरल fiddle- http://jsfiddle.net/78ghn/ है।

यह अन्य ब्राउज़रों में नहीं होता है - क्या क्रोम को मूल्य बनाए रखने के लिए मजबूर करने का कोई तरीका है ??

Answer 1

function f() 
 
{ 
 
    document.getElementById("b").appendChild(document.getElementById("a")); 
 
    document.getElementById("d").innerHTML = document.getElementById("c").innerHTML 
 
    document.getElementById("alert").innerHTML = 'Your last file was '.concat(document.getElementById("b").lastChild.value.slice(12)) 
 
} 
 
function g() 
 
{ 
 
    if(document.getElementById("b").lastChild.value) 
 
    { 
 
    \t document.write("You have submitted ".concat(document.getElementById("b").lastChild.value.slice(12))); 
 
    } 
 
    else 
 
    { 
 
    \t document.write("You have submitted nothing."); 
 
    } 
 
}

#a 
 
{ 
 
    opacity: 0; 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
#c 
 
{ 
 
    display: none; 
 
} 
 
#d 
 
{ 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
#e 
 
{ 
 
    background-color: green; 
 
    border: 2px solid black; 
 
    color: white; 
 
    font-size: 16pt; 
 
    width: 180px; 
 
    height: 90px; 
 
} 
 
#f 
 
{ 
 
    position: relative; 
 
    left: 25%; 
 
    bottom: 70%; 
 
}

<form> 
 
    <div id='e'> 
 
    <span id='d'> 
 
     <input type="file" onchange='f();' id='a'> 
 
    </span> 
 
    <span id='f'>Select File</span> 
 
    </div> 
 
    <input type='button' value='Submit' onclick='g();'> 
 
</form> 
 
<span id='alert'>You have chosen no files.</span> 
 
<ul id='b'> 
 
</ul> 
 
<form id='c'> 
 
    <input type="file" onchange='f();' id='a'> 
 
</form>

मैं इस के लिए एक देशी कार्यान्वयन खोजने में असमर्थ था, इसलिए मैं अपने खुद के समाधान का प्रयास किया। यह कस्टम सीएसएस बटन ओवरले से इनपुट लेता है, फिर वास्तविक सूची में input तत्व जोड़ता है और उसे रिक्त स्थान से बदल देता है। मान पढ़ा और प्रदर्शित किया जाता है, क्योंकि यह सामान्य input के साथ होगा। इसमें शामिल नहीं है, लेकिन इसे प्रस्तुत करने में input (ul का अंतिम तत्व id='b' के साथ) form पर और इसे जावास्क्रिप्ट के माध्यम से सबमिट करने में शामिल होगा। यह इष्टतम नहीं है, लेकिन यह काम करता है।