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

jquery-列表中click元素的索引在IE 7中不同

  •  2
  • surajz  · 技术社区  · 14 年前

    CMS正在以这种格式生成内容。

    <ul id="slide_nav" class="tabs">
    <a name="ctn2363_2465" id="ctn2363_2465" class="hidden"></a><li id="button_1"><a class="ohlord" href="javascript: void(0);" id="b1">Bookbag</a></li>
    <a name="ctn2363_2466" id="ctn2363_2466" class="hidden"></a><li id="button_2"><a class="ohlord" href="javascript: void(0);" id="b2">help</a></li>
    <a name="ctn2363_2467" id="ctn2363_2467" class="hidden"></a><li id="button_3"><a class="ohlord" href="javascript: void(0);" id="b3">Team</a></li>
    <a name="ctn2363_2468" id="ctn2363_2468" class="hidden"></a><li id="button_4"><a class="ohlord" href="javascript: void(0);" id="b4">At</a></li>
    </ul>
    

    要获得单击链接的正确索引,我必须在IE7中执行此操作(在选择器中使用类信息)

    $("#slide_nav li a").click(function(){
       var index = $("#slide_nav li > a.ohlord").index(this);
    }); 
    

    关于火狐 $("#slide_nav li > a").index(this); 作品。在IE上,这会产生不正确的索引(0、2、4、6….)。有没有一种方法可以在IE 7中为上述HTML获得正确的索引,而不使用选择器中的类信息?

    我的第二个问题是

    $('#slides img')[index].attr('style', 'display: block;');
    

    不起作用。我必须 iterate through each $('#slides img') elements 设置属性。从$('slides img')[索引]返回的htmlelement对象不是jquery对象吗?

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

    为了回答你的第一个问题,我认为这个问题与列表的格式不正确有关。保险商实验室的直接子系统应该是lis,它应该包含所有其他内容。在标记中,每个li之前都会出现一个锚,这可能会导致IE7阻塞。

    <a name="ctn2363_2465" id="ctn2363_2465" class="hidden"></a>**<--this is suspect, restructure**<li id="button_1"><a class="ohlord" href="javascript: void(0);" id="b1">Bookbag</a></li>
    

    要回答第二个问题,您可以这样做:

    $('#slides img').eq(index).attr('style', 'display: block;');
    

    或:

    $('#slides img:eq(' + index + ')').attr('style', 'display: block;');
    

    或:

    $('#slides img')[index].style.display = 'block;';
    

    或:

    $('#slides img').get(index).style.display = 'block;';
    

    原因是 [index] 从您的示例中,它相当于 .get(index) ,获取一个dom元素,而不是jquery对象,因此 .attr() 不起作用。

    最后一点, .show() 可以替代 .attr('style', 'display: block;'); 别忘了你可以用 .css() 获取或设置样式属性,例如 .css("display", "block");