在這種情況下,我幾乎不知道如何想出FileReader()的替代方案。我知道如果FileReader()未定義來執行其他操作,我可以調用,但我的選擇還有什麼。FileReader()的替代方法javascript
感謝,
HTML -
<form method='post' enctype='multipart/form-data' action='#'>
<div style="height: 200px;">
<div class="droparea spot logoupload">
<div class="instructions"><img class="previewlogo" src="http://wmemusic.com/wme/admin/img/loginlogo.jpg" alt="Click or Drag image here to add login logo"/>
</div>
<input type="file" class="droparea spot logoupload" name="logo" onchange="readURL(this);"/>
</div>
</div>
</form>
CSS -
.droparea {
position:relative;
text-align: center;
min-height:100px;
margin:0;
}
.droparea div, .droparea input {
position: absolute;
top:0;
right:2px;
width: 100%;
height: 100%;
}
.droparea input {
cursor: pointer;
opacity: 0;
}
.droparea .instructions {
border: 2px dashed #ddd;
max-height:200px;
height:auto;
min-height:100px;
overflow:hidden
}
.droparea .instructions.over {
border: 2px dashed #000;
background: #ffa;
}
#areas { width: 480px; }
div.spot {
margin: 5px auto;
}
.logoupload {width: 262px;
min-height: 100px;
height:auto;}
JAVASCRIPT -
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
var imgHeight = $(".previewlogo").height();
reader.onload = function(e) {
$('.previewlogo').attr('src', e.target.result)
$('.droparea').attr('style', 'height:', imgHeight, 'px;')
};
reader.readAsDataURL(input.files[0]);
}
}
我可以使用它來檢測它:if (typeof FileReader !== "undefined")
我不知道任何其他選項;這就是開發HTML5文件的全部原因。 – Pointy 2012-01-09 20:47:01
權利,但safari決定不使用它,並根據caniuse.com它看起來不像有任何計劃,包括它 – 2012-01-09 20:49:56
'URL.createObjectURL'是一種替代方案 – Endless 2016-09-08 20:54:56