【问题标题】:jquery problem internet explorer 9 and 7jquery问题Internet Explorer 9和7
【发布时间】:2025-12-28 21:20:10
【问题描述】:
 $(document).ready(function(){
    $("#yanMenu ul").hide();
    $("div#button").click(function(){
        $(this).next().slideToggle("normal");
        });
    });


                        <div id="yanMenu">          
                           <div id="button"><h5>Kategori 1</h5></div>
            <ul>
                <li><a href="#">Secenek 1</a></li>
                <li><a href="#">Secenek 2</a></li>
                <li><a href="#">Secenek 3</a></li>
                <li><a href="#">Secenek 4</a></li>
            </ul>
            </div>
<!-- This code it doesnt work!-->
                        <div id="yanMenu">          
                               <div id="button"><h5>Kategori 1</h5></div>
                <ul>
                    <li><a href="#">Secenek 1</a></li>
                    <li><a href="#">Secenek 2</a></li>
                    <li><a href="#">Secenek 3</a></li>
                    <li><a href="#">Secenek 4</a></li>
                </ul>
                </div>
<!-- This code it doesnt work!-->

这是切换菜单脚本。当我再次复制这段 html 代码时,它在 ie9 和 ie 7 中不起作用,我该怎么办?

【问题讨论】:

    标签: jquery internet-explorer-7 internet-explorer-9 toggle next


    【解决方案1】:

    因为您在页面中多次使用相同的 ID。 ID 应该是唯一的(每页只有一个实例)

    尝试改用类。

     $(document).ready(function(){
        $(".yanMenu ul").hide();
        $(".button").click(function(){
            $(this).next().slideToggle("normal");
            });
        });
    
    
         <div class="yanMenu">          
          <div class="button"><h5>Kategori 1</h5></div>
            <ul>
                <li><a href="#">Secenek 1</a></li>
                <li><a href="#">Secenek 2</a></li>
                <li><a href="#">Secenek 3</a></li>
                <li><a href="#">Secenek 4</a></li>
            </ul>
            </div>
       <div class="yanMenu">          
          <div class="button"><h5>Kategori 1</h5></div>
            <ul>
                <li><a href="#">Secenek 1</a></li>
                <li><a href="#">Secenek 2</a></li>
                <li><a href="#">Secenek 3</a></li>
                <li><a href="#">Secenek 4</a></li>
            </ul>
            </div>
    

    【讨论】:

      【解决方案2】:

      ID 值应该是唯一的(我假设如果您有重复,您的编译器可能会给您一个警告)。这些可以属于同一类,或者您甚至可以为您的标记使用名称属性。

      $('div[class="toggle"]').click(function(){.....}
      <div id="button1" class="toggle">
      <div id="button2" class="toggle">
      

      ...或名称属性而不是类,但类可能是最好的方法

      【讨论】: