根據(jù)分類深度創(chuàng)建多級(jí)分類下拉列表-select多級(jí)分類
廣告:
<script type="text/javascript">
$("#liveclass").ready(function() {
var l = document.getElementById("liveclass");
l.innerHTML = "";
var depths=<%=Depth%>;
var fileurl="jquery/Liveclass.aspx";
startclass(depths,l);
loadclass(0, 0, 0,depths,fileurl); //深度0,parentid=0,nowid,depths,url
});
</script>
class.js文件:
function startclass(depths,ldiv) { // 深度 初初化select
for (i = 0; i <= depths; i++) {
var ndiv = newdiv(i); //創(chuàng)建seldiv
var selid = "sel" + i;
var se = document.createElement("select"); //創(chuàng)建select
se.name = selid;
se.id = selid;
opt(se,"請(qǐng)選擇","",0)
var object = ndiv.appendChild(se);
ldiv.appendChild(ndiv);
}
}
function loadclass(depth, pid, nowid, depths, fileurl) { //五個(gè)參數(shù):當(dāng)前深度,參數(shù)父id,liveclass層,當(dāng)前選中的id(0為未選中)
//se.options[0] = new Option("請(qǐng)選擇", "");
//這里開始加載數(shù)據(jù)
var selid = "sel" + depth;
var se = document.getElementById(selid); //取得select
for (i = depth; i <= depths; i++) {
var sel = document.getElementById("sel" + i);
sel.options.length = 0;
opt(sel, "請(qǐng)選擇", "", 0); //opt--------opt
}
Optionadd(pid, se, nowid, fileurl)
//這里加載數(shù)據(jù)完
//se.size = "2";
if (depth<depths)
{
depth++;
$("#" + selid).change(function() {//載入下級(jí)分類數(shù)據(jù);
var tempv=this.options[this.selectedIndex].value;
if (tempv != "")
{ loadclass(depth, tempv, 0, depths, fileurl); }
else
{
for (i = depth; i <= depths; i++) {
var sel = document.getElementById("sel" + i);
sel.options.length = 0;
opt(sel, "請(qǐng)選擇", "", 0); //opt--------opt
}
}
});
}
}
function Optionadd(pid, sel, nowid, fileurl) { //pid父類id ,sel,nowid現(xiàn)在正在的nowid----創(chuàng)建多個(gè)option
//分類開始載入
$.ajax({
type: "POST",
url: fileurl, //
dataType: "json",
data: { "p": "" + pid + "" }, //p傳輸?shù)膮?shù)
success: function(json) {
if (json != 0) {
var issel = 0;
for (i = 0; i < json.classtable.length; i++) { //json為回傳的數(shù)據(jù);"classtable"表名在回傳的json數(shù)據(jù)
issel = 0
if (json.classtable[i].id == nowid) {
issel = 1;
}
opt(sel, json.classtable[i].classname, json.classtable[i].id, issel); //opt--------opt
}
}
}, error: function(json) { alert("error-$.ajax" + json); }
});
//分類載入數(shù)據(jù)完
}
//創(chuàng)建單個(gè)option
function opt(sel, txt, value, issel) { //opt--------opt
var op = document.createElement("option");
op.value = value;
op.text = txt;
if (issel==1)
op.setAttribute("selected", "selected");
sel.options.add(op);
}
//創(chuàng)建div層
function newdiv(i) {
var ndiv = document.createElement("div");
ndiv.id = "seldiv" + i;
ndiv.className = "seldiv";
ndiv.setAttribute("name", "seldiv" + i);
return ndiv;
}
/*
原創(chuàng):郝海波 www.53bk.com QQ:28094735
ndiv.style.border = '1px solid #DDD';
var newText = document.createTextNode('這是新建立div中的文字。');
ndiv.appendChild(newText);
appendChild() 方法在節(jié)點(diǎn)的子節(jié)點(diǎn)列表末添加新的子節(jié)點(diǎn)。
insertBefore() 方法在節(jié)點(diǎn)的子節(jié)點(diǎn)列表任意位置插入新的節(jié)點(diǎn)。
l.insertBefore(ndiv1,ndiv2); 插入ndiv1;
l.removeChild(div1);
*/
廣告: