Javascript & DHTML上傳文件控件第2/4頁(yè)
更新時(shí)間：2008年07月03日 21:46:31 作者：
首先來(lái)做一個(gè)實(shí)例，批量上傳的UI控件。以后一般做的示例也是以UI控件為主的。都是封裝成Object或者用Function封裝成"Class"類(lèi)。
二、寫(xiě)出add方法的實(shí)現(xiàn)
復(fù)制代碼 代碼如下:
<script>
upload.prototype.add = function () {
/*
*生成一個(gè) file
*/
var self = this; var cnt = this._cnt;
var cFile = document.createElement("input");
cFile.type="file"; cFile.name="upload";
cFile.id = "upload_file_" +cnt;
/*
*生成一個(gè) 添加
*/
var cAdd = document.createElement("span");
cAdd.innerHTML="添加";
cAdd.onclick = function () {
self.add();
};
/*
*生成一個(gè) 刪除
*/
var cRemove = document.createElement("span");
cRemove.innerHTML="刪除";
cRemove.onclick = function () {
self.remove(cnt);
};
cAdd.id = "upload_add_" +cnt;
cRemove.id = "upload_remove_" +cnt;
/* 把所有生成的信息添加到容器中 */
this.target.appendChild(cFile);
this.target.appendChild(cAdd);
this.target.appendChild(cRemove);
/* 計(jì)數(shù)器+1 */
this._cnt++;
return this; //返回
};
</script>
三、寫(xiě)出remove方法的實(shí)現(xiàn)
復(fù)制代碼 代碼如下:
<script>
upload.prototype.remove = function (n) {
/*
*刪除一個(gè) file
*/
var a = document.getElementById("upload_file_" +n);
a.parentNode.removeChild(a);
/*
*刪除一個(gè) 添加
*/
var a = document.getElementById("upload_add_" +n);
a.parentNode.removeChild(a);
/*
*刪除一個(gè) 刪除
*/
var a = document.getElementById("upload_remove_" +n);
a.parentNode.removeChild(a);
return this;
}
</script>
相關(guān)文章
innerHTML 和 getElementsByName 在IE下面的bug 的解決
innerHTML 真的一個(gè)麻煩的東西。IE 和 firefox 對(duì)dom 處理的方式不是很一樣。IE 對(duì)動(dòng)態(tài)加載的很多dom 不支持動(dòng)態(tài)更新。2010-04-04
查詢(xún)條件清空將input、select的值清空，下面有個(gè)不錯(cuò)的示例，需要的朋友可以了解下2014-01-01
JavaScript 動(dòng)態(tài)加載腳本和樣式的方法
這篇文章主要介紹了JavaScript 動(dòng)態(tài)加載腳本和樣式的方法,需要的朋友可以參考下2015-04-04
javascript實(shí)現(xiàn)無(wú)縫上下滾動(dòng)特效
這篇文章主要介紹了javascript實(shí)現(xiàn)無(wú)縫上下滾動(dòng)特效的相關(guān)資料,需要的朋友可以參考下2015-12-12
js獲得鼠標(biāo)的坐標(biāo)值的方法，需要的朋友可以參考一下2013-03-03
JavaScript語(yǔ)法 JSON序列化之stringify實(shí)例詳解
這篇文章主要為大家介紹了JavaScript語(yǔ)法 JSON序列化之stringify實(shí)例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-10-10
clipboard.js是一款輕量級(jí)的實(shí)現(xiàn)復(fù)制文本到剪貼板功能的JavaScript插件，本文就詳細(xì)的介紹一下如何使用，感興趣的可以了解一下2021-11-11
淺談JavaScript 執(zhí)行環(huán)境、作用域及垃圾回收
下面小編就為大家?guī)?lái)一篇淺談JavaScript:執(zhí)行環(huán)境、作用域及垃圾回收。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
JS動(dòng)態(tài)修改iframe內(nèi)嵌網(wǎng)頁(yè)地址的方法
這篇文章主要介紹了JS動(dòng)態(tài)修改iframe內(nèi)嵌網(wǎng)頁(yè)地址的方法,涉及javascript動(dòng)態(tài)修改iframe中src屬性的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-04-04
這篇文章主要介紹了js中的幾種設(shè)計(jì)模式，文中講解非常細(xì)致，代碼幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下2020-07-07