javascript - display = 'none' 在 Mozilla 中有效，但在 Chrome 中无效

Question

这个问题已经有答案了:

已关闭 10 年前。

Possible Duplicate:
Applied style=“display:none” in <option> not working in IE but working Mozilla

我有一个 JS，应该在列表中搜索并仅显示结果并隐藏其他结果，由于某种原因我的代码只能在 Mozilla 中运行，有什么想法如何使其在 Chrome 和 IE 中运行吗？

这是代码:

<script type="text/javascript">
                    function searchit1() {
                        arrayAdmins = document.getElementById
                        var keyword = document.getElementById('searchbar1').value;
                        var xx = document.getElementById('allUsers');
                        var xy = document.getElementById('selectedUsers');
                        var selectedAdmins = [];
                        i = 0;
                        for (var i = 0; i < xx.length; i++) {
                            if (xx.getElementsByTagName('option')[i].innerHTML.toLowerCase().indexOf(keyword.toLowerCase()) == 0) {
                                xx.getElementsByTagName('option')[i].style.display = 'block';

                            }
                            else {
                                xx.getElementsByTagName('option')[i].style.display = 'none';

                            }
                        }
                        var j = xy.length;
                        for (var i = 0; i < xy.length; i++) {
                            if (xy.getElementsByTagName('option')[i].innerHTML.toLowerCase().indexOf(keyword.toLowerCase()) == 0) {
                                xy.getElementsByTagName('option')[i].style.display = 'block';

                            }
                            else {
                                xy.getElementsByTagName('option')[i].style.display = 'none';

                            }
                        }
                    }

                </script>

谢谢

Answer 1

表单控件的样式在浏览器和操作系统之间不一致。 Firefox 将允许您显示/隐藏 <option>通过操纵元素 display属性，但 Chrome 不会。我不确定IE。

最安全的方法是在某处拥有完整的选项列表(值或对象的数组)，并从 <select> 添加/删除元素根据需要，根据该列表。