您的位置：首页 > Web前端 > JavaScript

Javascript实现自动无限级关联下拉菜单

2007-09-07 13:43 337 查看

刚刚写完的，发上来大家共享一下

<html>

<head>

<title>级联下拉菜单</title>

<script>...

var nMaxLength = 0;

function init(obj)

...{

var hasChild = false;

var nodes = document.getElementsByTagName('p');

var selectobj;

var pid = (obj==undefined) ? 0 : parseInt(obj.value);

var selectobj = document.createElement('select');

selectobj.setAttribute('name','select_' + nMaxLength);

selectobj.onchange = function()

...{

var sels = document.getElementsByTagName('select');

for(var j=sels.length-1;j>0;j--)

...{

if(sels[j]==this)

...{

break;

}

nMaxLength--;

document.getElementById('div1').removeChild(sels[j]);

}

init(this);

}

for(var i=0;i<nodes.length;i++)

...{

var thispid = parseInt(nodes[i].getAttribute('pid'));

var id = parseInt(nodes[i].getAttribute('id'));

var n = nodes[i].getAttribute('n');

if(thispid == pid)

...{

var opt = document.createElement('option');

opt.setAttribute('value',id);

opt.innerText = n;

selectobj.appendChild(opt);

hasChild = true;

}

if(hasChild)

...{

nMaxLength++;

document.getElementById('div1').appendChild(selectobj);

init(selectobj);

}

function getMaxLength()

...{

document.forms[0].maxLength.value = nMaxLength;

return true;

}

</script>

</head>

</div>

</form>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航