运行代码框
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
CTagPages 属性 Tagpages 标签数组
方法
[n] 检索标签 Add 增加标签页 Delete 删除标签页 Update 更新标签页 Insert 插入标签页 Clear 清空标签页 SetTag 设置一个标签被选中,参数可以是TAG的ID也可以是序号 GetTag 得到被选中的TAG对象
CTag 属性 tagId 标签ID tagCaption 标签上显示的文字 tagContId 标签内容ID
JS类下载
// 使用方法 // 1.var tagpages = new CTagPages("maintag");建立一个TagPages对象,参数为这个标签页集合的ID,区分其它标签页 // 2.var tagpage = new CTPage("files","文件","content6");建立一个标签页,参数1指这个标签页的ID,参数2标签文字, // 参数3与此标签相对的DIV,如果指定一个文档中不存在的DIV则系统会自动创建一个DIV; // 3.tagpages.add(tagpage);使用ADD方法增加把标签增加到标签页中. // 4.document.all.tag.innerHTML = tagpages;把标签页增加到文档中. // 5.tagpages.setTag(1)或tagpages.setTag("files");设置默认选中的标签页,参数可以使用[数字]和[ID名称]两种方式 //
//公共变量 var currentTag = null; var currentDiv = null;
//////////////////////////////////////////////////////////////////// ////////////////////////////// //单个标签对象 function CTPage(tagId, tagCaption, tagDiv){ this.checkDiv(tagDiv); this.id = tagId; this.caption = tagCaption; this.divid = tagDiv; this.selected = false; }
function tagToString(){ var str = "<li class=\""; str += this.selected?"focus":"blur"; str += "\" id=\"" + this.id +"\"" + " divid=\"" + this.divid +"\"" + " onclick=\"secBoard(this)\"" + " >"+ this.caption + "</li>"; return str; }
function CheckDiv(divname){ var tdiv = document.getElementById(divname); if(!tdiv){ tdiv = document.createElement("DIV"); tdiv.id = divname; tdiv.className = "content"; tdiv.innerHTML = "新的"; document.body.appendChild(tdiv); } tdiv.style.display = "none"; } CTPage.prototype.checkDiv = CheckDiv; CTPage.prototype.toString = tagToString; /////////////////////////////////////////////////////////////////// /////////////////////////// //标签集合对象
function CTagPages(id){ this.id = id; this.tagpages = new Array(); }
function Add(objtg){ this.tagpages[this.tagpages.length] = objtg; }
function pageToString(){ var str="<ul id=\""+this.id+"\" class=\"tagpage\">"; for(var i=0; i<this.tagpages.length; i++){ str += this.tagpages[i]; } str +="</ul>"; return str; }
function Index(n){ if(n>this.tagpages.length-1 || n<0){ return; }else{ return this.tagpages[n]; } }
function SetTag(n){ var curtag = null; if(typeof(n)=="string"){ curtag = document.getElementById(n); }else{ var curtag = document.getElementById(this.id).childNodes[n]; } if(curtag){ if(currentTag && currentDiv){ currentTag.className = "blur"; currentDiv.style.display = "none"; } curtag.className = "focus"; currentTag = curtag; var curDiv = document.getElementById(curtag.divid); curDiv.style.display = "block"; currentDiv = curDiv; } }
CTagPages.prototype.setTag = SetTag; CTagPages.prototype.index = Index; CTagPages.prototype.add = Add; CTagPages.prototype.toString = pageToString;
//////////////////////////////////////////////////////////////// ///////////////////////////////// //通用函数
function secBoard(obj) { //var obj = event.srcElement; currentTag.className = "blur"; currentTag = obj; currentTag.className = "focus"; currentDiv.style.display = "none"; currentDiv = document.getElementById(obj.divid); currentDiv.style.display = "block"; }
经典论坛讨论帖: http://www.blueidea.com/bbs/NewsDetail.asp?id=2534868
出处:蓝色理想
责任编辑:moby
◎进入论坛网页制作、网站综合版块参加讨论
|