有了两层关联下拉框的经验,实现三层的关联下拉框确实很容易。
当然,为了被前令狐同学再次BS我的算法BT,我首先改写了clearOptions函数:
function clearOptions(selectID) { var sel=document.getElementById(selectID); var len=sel.length; var i; for(i=1;i<len;i++) sel.remove(1); // I keep on removing the 1st item in the select! }
说明一下,我这样编程是有一定的道理的。虽然说,更“好”的代码应该似乎是每次都删除最后一个(类似:remove(sel.length))。但是,由于每次删除后,sel.length都会发生变化,所以在每次删除最后一个的时候,sel.length都会被重新取值,这个对于jQuery来说开销还是很大的,特别是如果select下的option比较多的时候。所以,我还是选择每次删除第一个的做法。这样,remove(1)中的参数是个常量,只需要取值一次从而大大的缩减了运行时间。
同时我将addOption,fillLevel等多次调用的代码段抽出作为独立的函数。在fillLevel函数中,还特意混合了jQuery和标准javascript。
这样一来,jQuery的ready函数写法就更清晰明了了。同时,为了温故知新,我还加入了在第二个例子中实现的“Loading”提示。目前的问题时,在填充level1的时候,不会出现这个提示,而只有在填充level2和level3的时候才出现这个提示。暂时不管这个小小的问题了。
完整的示范在此处。
代码不再贴出,有兴趣的可以在页面自行下载研究。
真是太BT了太BT了。
这种删法如果sel是一个静态数组的实现的话,效率是超低的(比每次调用str.length还要低,因为可能每删一次都要将后面的元素逐个前移)
事实上,一般我们的实现都是这样的:
for (i = len; i >= 1; --i) { sel.remove(i); }看,一个多余的函数调用也没有……
靠,又被前令狐BS了……
当然,前令狐的算法是更对的……