请教大神，关于前端下拉框问题

问题描述：

例。第一个下拉框(a)，选中第一个值(a.1)的时候onchange,移除第二个下拉框（b）的4 5 6。第一个下拉框选中第二个(a.2)的时候给第二个下拉框（b）添加 4 5 6 比如，下拉框b的值有 1 2 3 4 5 6

答

 <select id="a">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
<select id="b">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
</select>
<script>

    var a = document.getElementById('a'), b = document.getElementById('b');
    a.onchange = function () {
        var dp = this.value == '1' ? 'none' : '', re = /^[456]$/;
        for (var i = 0; i < b.options.length; i++) {
            if (re.test(b.options[i].value)) b.options[i].style.display = dp;
        }
        if (re.test(b.value)) b.selectedIndex = 0;
    }
    a.onchange();
</script>

答

JSON或数组缓存数据来，当onchange触发时，根据逻辑填充联动数据加载到下拉框中即可。

请教大神，关于前端下拉框问题

相关推荐