Question

HY，

我有一个很长的列表，我决定通过将所有内容列表放在选择选项中来缩短它，当您选择某个制造商时，它会显示该制造商的电话号码以防万一。当我在不同的浏览器（Chrome，Firefox，Opera，Safari）中测试它时，当我到达着名的Internet Explorer（版本9）时，繁荣不起作用。当我选择任何选项时，它根本不显示任何内容。

我的以下html标记是：

<select id="technical-assit">
                <option value="choose-brand">Choose Manufacturer</option>
                <option value="3COM">3COM</option>
                <option value="3DFX">3DFX</option>
                <option value="ACER">ACER</option>
                <option value="AIRIS">AIRIS</option>
                <option value="AIT">AIT</option>
                <option value="AGFA">AGFA</option>
                <option value="AIRTEL">AIRTEL / VODAFONE</option>
                <option value="AIWA">AIWA</option>
                <option value="ALCATEL">ALCATEL</option>
</select>

<div id="3COM" class="contact-number" style="display:none">91 509 69 00</div>
<div id="3DFX" class="contact-number" style="display:none">900 501 303</div>
<div id="ACER" class="contact-number" style="display:none">902 202 323</div>
<div id="AIRIS" class="contact-number" style="display:none">902 103 444</div>
<div id="AIT" class="contact-number" style="display:none">902 11 66 21</div>
<div id="AGFA" class="contact-number" style="display:none">902 15 25 93</div>
<div id="AIRTEL" class="contact-number" style="display:none">607 123 000</div>
<div id="AIWA" class="contact-number" style="display:none">91 358 11 02</div>
<div id="ALCATEL" class="contact-number" style="display:none">91 330 40 00</div>

只是列表的一小部分。我的java脚本标记是：

<script>

    $(function() {
    $('#technical-assit').change(function(){
        $('.contact-number').hide();
        $('#' + $(this).val()).show();
    });
});

</script>

任何想法？！

谢谢

Answer 1

原因是IE有一些问题，你可以看到更改方法here，你也可以看到change method in documentation，它说从jQuery 1.4开始，互联网上的变化事件起泡资源管理器，与其他现代浏览器中的事件保持一致。

要渲染这项工作，你应该使用点击方法，而不是在IE中更改，对于其他浏览器，如mozilla，chrome ....使用更改方法。

只需一步即可完成此操作，您可以使用更改并同时点击：

<script>

$(function() {
   $('#technical-assit').live("change click", function(){
      $('.contact-number').hide();
      $('#' + $(this).val()).show();
   });
});

此代码使用.live（）来响应这两个事件

注意：如果您使用jQuery 1.7+ live（）方法已删除，您可以使用 on（）方法

选择显示/隐藏IE9选项的选项

1 个答案: