Maison >interface Web >js tutoriel >Le fichier de téléchargement JS n'actualise pas la page actuelle
Cette fois, je vais vous apporter les précautions pour le téléchargement de fichiers JS qui n'actualisent pas la page actuelle et le téléchargement de fichiers JS qui n'actualisent pas la page actuelle. Ce qui suit est un cas pratique, jetons un coup d'oeil.
Utilisez js pour fournir une solution sans actualiser la page lors du téléchargement de fichiers
2eed732a8643f81570eb2757cb89c834 0e5999c1a9f42bf9dc0af437dd98b40bupload65281c5ac262bf6d81768915a4a77ac0 document.getElementById('upload-btn').onclick =function(){ varoInput = document.getElementById('upload'); varfile = oInput.files[0]; //选取文件 varformData =newFormData();//创建表单数据对象 formData.append('file',file);//将文件添加到表单对象中 fetch({ //传输 url:'./', mothod:'POST', body:formData }) .then((d)=>{ console.log('result is',d); alert("上传完毕!") }) }
Pour obtenir un tel effet :
Utilisez HTML+CSS pour implémenter la mise en page comme indiqué, border-width:5px, la taille de la grille est de 50px*50px, au survol, la bordure devient rouge, vous devez considérer la sémantique .
table{ border-collapse:collapse;/* 为表格设置合并边框模型 */ margin:50px; text-align:center;/* 设置文字居中 */ } table tr{ border:none; } table.tab td{ width:50px; height:50px; border:5pxinsetblue; } table.tab td:hover{ border:5pxsolidred; 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>
Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !
Lecture recommandée :
JS implémente un fondu d'entrée et de sortie uniforme des images
Comment convertir des nombres et chaînes en JS
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!