我想允许用户从他们的计算机中拖放(或选择)一个文件,并使用
JavaScript将其加载到文本框中.
是否可以将带有JavaScript的本地文件加载到文本框中？如果是,那怎么样？
解决方法
我认为HTML5所需的一切都包含在github上的
remy/html5demos中.
例如,我修改了http://html5demos.com/file-api以接受文本文件并在浏览器中显示它们.
见jsfiddle.
编辑
相关脚本：
// modified from http://html5demos.com/file-api
var holder = document.getElementById('holder'),state = document.getElementById('status');
if (typeof window.FileReader === 'undefined') {
state.className = 'fail';
} else {
state.className = 'success';
state.innerHTML = 'File API & FileReader available';
}
holder.ondragover = function() {
this.className = 'hover';
return false;
};
holder.ondragend = function() {
this.className = '';
return false;
};
holder.ondrop = function(e) {
this.className = '';
e.preventDefault();
var file = e.dataTransfer.files[0],reader = new FileReader();
reader.onload = function(event) {
console.log(event.target);
holder.innerText = event.target.result;
};
console.log(file);
reader.readAsText(file);
return false;
};