Cet article présente principalement la méthode de téléchargement de fichiers à l'aide de JavaScript sans actualiser la page. Il utilise le code js+css pour présenter le processus de fonctionnement en détail. Les amis qui en ont besoin peuvent se référer à
Utilisation. js pour donner un upload Une solution sans rafraîchir la page lors de l'édition d'un fichier
<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("上传完毕!") }) }
Obtenir un tel effet :
Utilisez HTML+CSS pour obtenir Comme indiqué dans la mise en page, largeur de bordure : 5 px, la taille de la grille est de 50 px*50 px, lors du survol, la bordure devient rouge, la sémantique doit donc être prise en compte.
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>
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!