您好,登录后才能下订单哦!
密码登录
登录注册
点击 登录注册 即表示同意《亿速云用户服务条款》
这篇文章主要为大家展示了“JavaScript如何实现上传文件时不用刷新页面”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript如何实现上传文件时不用刷新页面”这篇文章吧。
用js给出一个上传文件时不用刷新页面的方案
<input id="upload" type="file"/> <button id="upload-btn">upload</button> document.getElementById('upload-btn').onclick = function(){ var oInput = document.getElementById('upload'); var file = oInput.files[0]; //选取文件 var formData = new FormData(); //创建表单数据对象 formData.append('file',file); //将文件添加到表单对象中 fetch({ //传输 url:'./', mothod:'POST', body:formData }) .then((d)=>{ console.log('result is',d); alert("上传完毕!") }) }
实现这么一个效果:
使用HTML+CSS实现如图布局,border-width:5px,格子大小是50px*50px,hover时,边框变成红色,需要考虑语义化。
table{ border-collapse:collapse; /* 为表格设置合并边框模型 */ margin:50px; text-align:center; /* 设置文字居中 */ } table tr{ border:none; } table.tab td{ width:50px; height:50px; border:5px inset blue; } table.tab td:hover{ border:5px solid red; cursor: pointer; } <table class="tab"> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table>
以上是“JavaScript如何实现上传文件时不用刷新页面”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。