JavaScript의 파일 판독기 인터페이스를 통해 파일을 읽는 방법에 대한 코드 예
- 黄舟원래의
- 2017-05-14 10:16:421874검색
이 글에서는 주로 파일리더인터페이스를 통해 파일을 읽는 방법과 readAsDataURL 메서드를 사용하여 사진을 미리 보는 방법을 자세히 소개합니다. 관련 메소드에는 특정 참조 값이 있습니다. 관심 있는 친구는
FileReader 인터페이스의 readAsDataURL 메소드를 사용하여 이미지를 미리 볼 수 있습니다.
소스코드:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>通过filereader接口读取文件</title>
<script type="text/javascript">
function readAsDataURL()
{
if(typeof FileReader=='undifined') //判断浏览器是否支持filereader
{
result.innerHTML="<p>抱歉，你的浏览器不支持 FileReader</p>";
return false;
}
var file=document.getElementById("imagefile").files[0];
if(!/image\/\w+/.test(file.type)) //判断获取的是否为图片文件
{
alert("请确保文件为图像文件");
return false;
}
var reader=new FileReader();
reader.readAsDataURL(file);
reader.onload=function(e)
{
var result=document.getElementById("result");
result.innerHTML='<img src="'+this.result+'" alt=""/>'
}
}
</script>
</head>
<body>
<p>
<label>请选择一个文件：</label>
<input type="file" id="imagefile" />
<input type="button" value="读取图像" onClick="readAsDataURL();" />
</p>
<p name="result" id="result">
<!-- 这里用来显示图片结果-->
</p>
</body>
</html>위 내용은 JavaScript의 파일 판독기 인터페이스를 통해 파일을 읽는 방법에 대한 코드 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.