- From: Ian Hickson via cvs-syncmail <cvsmail@w3.org>
- Date: Tue, 15 Sep 2009 11:58:40 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/spec In directory hutz:/tmp/cvs-serv15306 Modified Files: Overview.html Log Message: Include an example for how to get the filename out of input.value (whatwg r3863) Index: Overview.html =================================================================== RCS file: /sources/public/html5/spec/Overview.html,v retrieving revision 1.3028 retrieving revision 1.3029 diff -u -d -r1.3028 -r1.3029 --- Overview.html 15 Sep 2009 11:21:47 -0000 1.3028 +++ Overview.html 15 Sep 2009 11:58:37 -0000 1.3029 @@ -30422,6 +30422,43 @@ <p>User agents should prevent the user from selecting files that are not accepted by one (or more) of these tokens.</p> + </div><div class="example"> + + <p>For historical reasons, the <code title="dom-input-value"><a href="#dom-input-value">value</a></code> IDL attribute prefixes the + filename with the string "<code title="">C:\fakepath\</code>". Some + legacy user agents actually included the full path (which was a + security vulnerability). As a result of this, obtaining the + filename from the <code title="dom-input-value"><a href="#dom-input-value">value</a></code> IDL + attribute in a backwards-compatible way is non-trivial. The + following function extracts the filename in a suitably compatible + manner:</p> + + <pre>function extractFilename(path) {<!-- + if (path.substr(0, 12) == "C:\\fakepath\\") + return path.substr(12);--> + var x; + x = path.lastIndexOf('\\'); + if (x >= 0) // Windows-based path + return path.substr(x+1); + x = path.lastIndexOf('/'); + if (x >= 0) // Unix-based path + return path.substr(x+1); + return path; // just the filename +}</pre> + + <p>This can be used as follows:</p> + + <pre><p><input type=file name=image onchange="updateFilename(this.value)"></p> +<p>The name of the file you picked is: <span id="filename">(none)</span></p> +<script> + function updateFilename(path) { + var name = extractFilename(path); + document.getElementById('filename').textContent = name; + } +</script></pre> + + <!-- How useful this actually is... is unclear. --> + </div><hr><div class="bookkeeping impl"> <p>The following common <code><a href="#the-input-element">input</a></code> element content
Received on Tuesday, 15 September 2009 11:58:50 UTC