ajax上傳進度條

時間 2019-11-22

標籤 ajax 上傳進度欄目 Ajax 简体版

原文原文鏈接

<script type="text/javascript">
　　function register(){
　　　　var frm = document.getElementById('frm');
　　　　var fd = new FormData(frm);
　　　　var request = new XmlHttpRequest();
　　　　request.open('post', './demo.php');
　　　　request.onreadystatechange = function(){
　　　　　　if (request.readystate == 4 && request.status == 200) {
　　　　　　　　　　if(request.responseText == '1'){
　　　　　　　　　　　　alert('上傳成功!');
　　　　　　　　　　}
　　　　　　}
　　　　　　request.send(fd);
　　　　　　//上傳進度條
　　　　　　request.upload.onprogress = function(e){
　　　　　　　　var total = e.total;//總大小
　　　　　　　　var loaded = e.loaded; //已上傳的大小
　　　　　　　　var percent = Math.floor(loaded/total*100);
　　　　　　　　document.getElementById('in').style.width = percent+'%';
　　　　　　　　document.getElementById('in').innerHTML = percent+'%';javascript

　　　　　　}
　　　　}
　　}
</script>
</head>
<body>
<form id="frm">
　　用戶名:<input type="text" name="username"><br>
　　頭像:<input type="file" name="face"><br>
　　<div id="out">
　　　　<div id="in"></div>
　　</div>
　　<input type="button" value="上傳" id="btn">
</form>
</body>php

相關文章

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

最新文章

本站公眾號

歡迎關注本站公眾號,獲取更多信息

相關文章

>>更多相關文章<<