联动的设计

联动控件一般用于下拉列表,例如省市县的联动。

很早的时候有些初级的实现只做到了固定级别(比如二级、三级)的联动,它们传入固定 的 N 个 <select> DOM 元素,形成固定的 N 级联动关系。后来有了一些较好的实现, 这些实现做到了动态级别的联动(即无限级联动)。

早期的无限级联动控件,一般实现是通过主动下拉列表在 onchange 触发时主动调用 被动列表的更新 <option> 的方法,或者甚至在 onchange 处理函数中直接操作从动列表 的 <option>

主动调用从动列表的更新函数,则需要事先函数名称及传参的约定。 直接操作从动列表的 <option> 就更不靠谱了,灵活性也更差。

另外,这两种实现只能做到一维的线性联动,即一个主动列表对应一个从动列表,要实现 一个主动列表联动多个(不确定数量的)从动列表,则比较麻烦/困难。

另一种更好的实现,则是让从动列表来确定自己的主动列表,并监听主动列表的 change 事件。这种实现可以轻易做到动态级别、动态维度的联动,各个 <select> 的数据源及 及处理函数都由自身确定。

总结:

这里 事件监听 ,比 主动调用 的设计思想更优秀。

Help
[count]gg 跳转到第 [count] 行,默认第 1 行。
[count]G 跳转到第 [count] 行,默认最后一行。
[count]j 向下跳转 [count] 行,默认跳转一行。
[count]k 向上跳转 [count] 行,默认跳转一行。
/ 开始搜索。按 <Esc> 退出。
gh 跳转到首页。
gb 跳转到博客首页。
gw 跳转到 Wiki 首页。
gt 跳转到我的 Twitter Profile 页。
gp 跳转到我的 Github Profile 页。
? 打开帮助。按 <Esc> 退出。