Question

我在HTML中关注结构

<ul class="nav">
<li><a href="...">NA</a></li>
<li class="bottomup">
    <a href="..." >A</a>
    <ul>
        <li><a href="...">B</a></li>
        <li><a href="...">C</a></li>
    </ul>
</li>
<li class="bottomup">
    <a href="..." >X</a>
    <ul>
        <li><a href="...">Y</a></li>
        <li><a href="...">Z</a></li>
    </ul>
</li>

并且要求是，如果用户点击NA，A或X，那么这些项目的兄弟会被隐藏，如果他们有子列表（例如A }，X）然后只显示在立即子列表顶部的LI中添加锚标记的情况。所以，如果我点击A，那么结果应该是

<ul class="nav">
<li><a href="...">NA</a></li> //hidden
<li>
    <a href="..." >A</a> //hidden
    <ul>
        <li><a href="...">A</a></li>
        <li><a href="...">B</a></li>
        <li><a href="...">C</a></li>
    </ul>
</li> //hidden
<li>// hidden
    <a href="..." >X</a>
    <ul>
        <li><a href="...">Y</a></li>
        <li><a href="...">Z</a></li>
    </ul>
</li>

为了达到这个目的，我克隆了锚标记并添加到LI内的直接UL中，并使用.remove()删除了锚标记（尝试.hide()而不是删除）。问题是锚标签以及LI有一些带填充和背景图像的css。在所有的浏览器中它工作正常，但在IE中，当我检查时，我看到lis的边界完全对齐w.r.t到UL但是锚标签从顶部几个像素被放置而没有css修复解决这个问题。请帮忙。

请注意，单击“打开”类会添加到选定的LI，并且“选定”类会添加到锚点。

JavaScript代码是：

var topDownItems = $('div#main_nav ul.nav').find('.open');
if(topDownItems.length>0){
    for(var i=0;i<topDownItems.length;i++){
        var item = $(topDownItems)[i];
        var classname = $(item).attr('class');
        if(classname=='bottomup open'){             
            $("<li />").append($(item).children('a').clone()).prependTo($(item).children('ul'));
            $(item).children('a').remove();
            $(item).children('ul').each(function(){
                $(this).children('li').each(function(){
                    $(this).find('ul').each(function(){
                        $(this).hide();
                    });
                });
            });
        }
    }
}

谢谢，阿沙

jquery.remove（）函数在IE7中无法正常工作

0 个答案: