需要在选择属性中具有一组动态值,具体取决于另一个选择属性。
例如将有两个下拉属性 1. 父下拉菜单,2. 子下拉菜单
如果在父下拉列表中选择“A”,则下拉列表中将显示“Air”、“Apple”、“Ant”。
如果在父属性中选择“B”,则将显示“Ball”、“Box”、“Base”。
因此,子下拉列表的值基本上取决于父下拉列表的选定值。
我想使其动态,因为选项可以保存在属性下,并且这些值将显示在目录产品编辑页面中。
提前致谢。
如果您在 JS 中的对象或数组中的选择框中有数据,请尝试以下代码,那么您可以轻松过滤掉它并将其附加到选择框
这是演示DEMO http://jsfiddle.net/adn8qhvs/
var data = {
"A": ["Air", "Apple", "Ant"],
"B": ["Water", "Mango", "Fly"]
}
jQuery('#parent').on('change', function() {
var tempData = data[this.value];
var selectChild = jQuery('#child');
jQuery('option', selectChild).remove();
for (var i = 0; i < tempData.length; i++) {
var option = new Option(tempData[i], tempData[i]);
selectChild.append(jQuery(option));
}
});
<select id="parent">
<option value="">Select Parent</option>
<option value="A">A</option>
<option value="B">B</option>
</select>
<select id="child">
<option value="">Select Child</option>
</select>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)