


有一個問題:上傳一次在上傳一次關閉按鈕會出現兩次,關閉之后還有一個(改好了可以告訴我我在修正過來)


<div id="box"> <div class="img-d"> <span class="up-s"></span> <input type="file" id="up" multiple name="files"> </div> <button type="submit">確認提交</button> </div> <script> // span的點擊事件 var addBtn = document.querySelector('.up-s'); addBtn.addEventListener('click',function () { document.querySelector('#up').value = null; document.querySelector('#up').click(); return false; },false); // 處理input點擊之后的change事件 document.getElementById("up").addEventListener("change",function(e){ var files =this.files; var fileType = document.getElementById("up").value; if(!/\.(gif|jpg|jpeg|png|GIF|JPG|JPEG|PNG)$/.test(fileType)) { alert("圖片類型必須是.gif,jpeg,jpg,png中的一種"); return false; } var reader =new FileReader(); reader.readAsDataURL(files[0]); reader.onload =function(e){ var dx =(e.total/1024)/1024; if(dx>=1){ alert("文件大小大於2M"); return false; } var result =this.result;//這里就是轉化之后的DataURL addBtn.style.backgroundImage = "url("+result+")"; var rem =document.createElement("i"); rem.setAttribute("class","rems"); rem.innerHTML ="x"; document.querySelector(".img-d").appendChild(rem); rem.addEventListener('click',function () { //this.style.remove ="none"; rem.parentNode.removeChild(rem); addBtn.style.backgroundImage = "url(images/xztpp.png)"; }); }; }) </script>
