close

參考文章之內容

<input accept="image/*" id="uploadImage" type="file">
<img id="img" src="">
<script>
	$("#uploadImage").change(function(){
		readImage( this );
	});
 
	function readImage(input) {
		if ( input.files && input.files[0] ) {
			var FR= new FileReader();
			FR.onload = function(e) {
				//e.target.result = base64 format picture
			$('#img').attr( "src", e.target.result );
		};       
		FR.readAsDataURL( input.files[0] );
		}
	}
</script>

修改為按下按鈕後才更換

<table>
    <tr>
          <td><input type="file" name="file" accept="image/*" id="uploadImage"/></td>
          <td><button type="submit" class="btn btn-primary" onclick="JavaScript:return Validator();">更換</button></td>
    <tr/>
</table>

<script>
	var upload = document.querySelector('#uploadImage');
	if ( upload.files && upload.files[0] ) {
		alert('test');
		var FR= new FileReader();
		FR.onload = function(e) {
			//e.target.result = base64 format picture
			$('#prove_img').attr( "src", e.target.result );
		};
		FR.readAsDataURL( upload.files[0] );
	}
</script>

參考文章:

http://howard10335.blogspot.tw/2015/09/javascripthtml-inputbase64-string.html

arrow
arrow
    全站熱搜

    kkkelu1008 發表在 痞客邦 留言(0) 人氣()