功能:给fieldset的标题部分添加折叠的事件,在页面布局中经常用到。
适用平台:IE、谷歌、火狐浏览器
实现依赖:jQuery。
特点:代码简洁,适用性强。
$(document).ready(function(){
//寻找每一个样式为folding的 fieldset并检测有没有tgg的div
$(".folding").each(function(){
var t = $(this);
var count = t.find("div.div").size();
var height = t.attr("height");
var width = t.attr("width");
if(count==0){
//判断每一个fieldset下面是否有样式为tgg的div元素,没有就加一个
var datagriddiv = $("<div class='datagriddiv'></div>");
if (height != null){
datagriddiv.height(height);
}
if (width != null){
datagriddiv.width(width);
}
t.children().wrap(datagriddiv);
var div = $("<div></div>").addClass("div");
div.insertBefore(t.find("div.datagriddiv"));
var title = t.attr("title");
var divTitle = $("<div class='title'></div>");
div.append(divTitle);
div.append(title);
}
});
$(".folding div.div").click(function(){
$(this).children("div.title").toggleClass("titleDown");
$(this).parent().children("div.datagriddiv").slideToggle(200);
});
$(".folding table tbody tr").toggle(
function () {
$(this).addClass("selected");
},
function () {
$(this).removeClass("selected");
}
);
});
