![](/img/trans.png)
[英]I want to append the files to $_FILES on multiple times input type files image select
[英]I want to display image on select input file
我的jQuery
代碼無法正常工作。 我想在用戶選擇輸入文件時顯示圖像。 請幫忙。
我正在使用data-val
屬性保存ID。 這是我的代碼:
</script>
<script type="text/javascript">
function readURL(input, id) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$(id).attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
jQuery(document).on("change", "#imgInp", function(){
var id = jQuery(this).data("val");
readURL(this, id);
});
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form1" runat="server">
<input type='file' data-val="#blash1" id="imgInp" />
<img id="blah1" src="#" alt="your image" />
<br>
<input type='file' data-val="#blash2" class="imgInp" />
<img id="blah2" src="" alt="your image" />
<br>
<input type='file' data-val="#blash3" class="imgInp" />
<img id="blah3" src="" alt="your image" />
</form>
嘗試這個:
HTML:
<form id="form1" runat="server">
<input type='file' data-val="#blash1" class="imgInp" /> // add class imgInp here
<img height="100" id="blah1" src="#" alt="your image" />
<br>
<input type='file' data-val="#blash2" class="imgInp" />
<img height="100" id="blah2" src="" alt="your image" />
<br>
<input type='file' data-val="#blash3" class="imgInp" />
<img height="100" id="blah3" src="" alt="your image" />
</form>
jQuery:
function readURL(input,img_name) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#'+img_name).attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$(".imgInp").change(function(){
var img_name = $(this).next("img").attr("id");
readURL(this,img_name);
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.