WPS js组合框二级联动
时间: 2024-06-07 10:04:05 浏览: 9
WPS Office中的JS组件,特别是WPS表格(以前称为kingsoft calc),提供了一种功能强大的数据绑定和交互选项,如组合框(ComboBox)的二级联动。二级联动通常指的是两个或多个下拉列表之间的关联,当用户在第一个列表中选择一个选项时,第二个列表会根据第一个列表的选择动态更新内容。
在WPS JS中,你可以使用`<wps:comboBox>`元素,结合`onChange`事件处理程序,来实现这样的联动效果。以下是一个基本的示例:
```html
<wps:comboBox id="comboBox1" data-source="data1">
<!-- 初始展示的数据 -->
</wps:comboBox>
<wps:comboBox id="comboBox2" data-source="data2" data-bind="value: selectedOption from comboBox1">
<!-- 第二级联动,值绑定到comboBox1的selectedOption -->
</wps:comboBox>
<script>
// WPS表格脚本
WPS.$(document).ready(function () {
// 假设data1和data2是你的数据源数组
var data1 = ...;
var data2 = ...;
// 初始化comboBox1
var comboBox1 = WPS("#comboBox1");
comboBox1.dataSource(data1);
// 当comboBox1的选择改变时,更新comboBox2的内容
comboBox1.onChange(function (event) {
comboBox2.dataSource(data2.filter(function(item) { return item.parentId === comboBox1.value; }));
});
});
</script>
```