代码之家  ›  专栏  ›  技术社区  ›  Omnia9

在FF模式下工作而不是在IE 7模式下工作

  •  0
  • Omnia9  · 技术社区  · 14 年前

    我有一个列表可以切换,在FF中没有问题。我需要这个工作(准备生产)。

    似乎(即)仅将JS应用于第一个订单项和第一个家庭。列表中的其余项将被忽略。

    任何帮助都会很好。

    一段HTML(大列表):

    <div class="classificationContainer">
    
            <ul class="classification" id="orderUL">
    
            <li id="orderItem" class="ordrheading">
                <div class="order">
    
                    <a href="?nav=search_recherche&amp;lang=en">
    
      <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_closedc.gif" alt="By Classification" id="OrdListImage" />
    
                        Apodiformes (Swifts and Hummingbirds)
                    </a>
                </div>
    
                        <ul class="classification" id="FamilyList">
    
                        <li id="familiy">
                            <div class="family">
                                <a href="?nav=search_recherche&amp;lang=en">
    
    
      <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_closedc.gif" alt="Family" id="FamListImage" />
    
                                    Apodidae (Swifts)
                                </a>
                            </div>
    
                                    <ul class="classification" id="SpiecesList">
    
                                    <li>
                                        <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_leafc.gif" alt="Species" />
                                        <a href="?lang=en&amp;nav=bird_oiseaux&amp;aou=423"> Chimney Swift (Chaetura pelagica) </a>
    
                                    </li>
    
                                    </ul>
    
                        </li>
    
                        <li id="familiy">
                            <div class="family">
                                <a href="?nav=search_recherche&amp;lang=en">
    
      <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_closedc.gif" alt="Family" id="FamListImage" />
    
                                    Trochilidae (Hummingbirds)
                                </a>
    
                            </div>
    
                                    <ul class="classification" id="SpiecesList">
    
                                    <li>
                                        <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_leafc.gif" alt="Species" />
                                        <a href="?lang=en&amp;nav=bird_oiseaux&amp;aou=428"> Ruby throated Hummingbird (Archilochus colubris) </a>
                                    </li>
    
                                    <li>
                                        <img src="http://dev.ncr.ec.gc.ca/publications/bba-aob/images/node_leafc.gif" alt="Species" />
    
                                        <a href="?lang=en&amp;nav=bird_oiseaux&amp;aou=433"> Rufous Hummingbird (Selasphorus rufus) </a>
                                    </li>
    
                                    </ul>
    
                        </li>
    
                        </ul>
    
            </li></ul></div>
    

    我有以下jquery函数:

    <script type="text/javascript">
        $(document).ready(function () {
        // toggle action for the order to familiy
        $("li#orderItem").click(function (event) {
            // toggle the image
            var src = ($("#OrdListImage", this).attr("src") == "/images/node_closedc.gif")
                    ? "/images/node_openc.gif"
                    : "/images/node_closedc.gif";
            $("img#OrdListImage", this).attr("src", src);
    
            //toggle the ul
            $('ul#FamilyList', this).toggle($('ul#FamilyList', this).css('display') == 'none');
    
            // stop all link actions
            return false;
        });
    
        //toggle action from familiy to speices
        $("li#familiy").click(function () {
            // toggle the image
            var src = ($("#FamListImage", this).attr("src") == "/images/node_closedc.gif")
                    ? "/images/node_openc.gif"
                    : "/images/node_closedc.gif";
            $("img#FamListImage", this).attr("src", src);            
            //toggle the ul
            $('ul#SpiecesList', this).toggle($('ul#SpiecesList', this).css('display') == 'none');
    
            // stop all link actions
            return false;
        });
    
    
    });
    

    2 回复  |  直到 14 年前
        1
  •  1
  •   egis    14 年前

    还要检查ID是否没有重复(只有一个orderitem,只有一个family等等)。id“属性在HTML文档中必须是唯一的,”class“可以重复。

        2
  •  0
  •   thomaux    14 年前

    jquery提供的toggle函数不能保证工作。我在jquery的主页上看不到这篇文章的参考资料。我遇到了同样的问题,并且(如jquery建议的那样)实现了我自己的切换函数。我建议尝试一下,因为这不是什么工作,可以为您提供一个解决方案。