IE上的jquery多个切换 [英] jquery multiple toggle on IE

问题描述

我正面临着在IE上进行多次切换的问题。除了IE（-_-）之外，它适用于所有其他浏览器。下面是我的代码的摘要。当我点击第一个超链接时，我只能 才能获得弹出警报。当我点击后续链接时没有弹出窗口

  $（文件）.ready（function（）{
 
 $（＃toggleFruitSlideBox）。click（function（）{
 alert（$（this）.text（））; 
 return false; 
}）; 
}）; 
 
< div id =bodykit_slidebox> 
< div style =padding：5px 0px 0px 5px;> 
< a id =toggleFruitSlideBoxhref =＃class =nav2> apple< / a> 
< a id =toggleFruitSlideBoxhref =＃class =nav2> orange< / a> 
< a id =toggleFruitSlideBoxhref =＃class =nav2> DURIAN< / a> 
< a id =toggleFruitSlideBoxhref =＃class =nav2> papaya< / a> 
< / div> 
  

解决方案

你有多个元素具有相同的 id 这是一个无效的HTML！

在这里检查我的答案：

jQuery id选择器仅适用于第一个元素

代码和代码之间的唯一区别另一个问题是你使用错误的选择器：

  $（＃toggleFruitSlideBox）
  

这导致jQuery不使用 document.getElementById ，所以这是为什么它适用于其他浏览器。

来自jQuery文档：

For id选择器，jQuery使用JavaScript函数document.getElementById（），这是非常有效的。当另一个选择器附加到id选择器时，例如h2＃pageTitle，jQuery在将元素标识为匹配之前执行额外的检查。

删除重复的id并使用其他选择器，如类选择器。

im facing issues with multiple toggling on IE. it works fine with all other browser except IE (-_-). below is a abstract of my code.basically im only able to get an popup alert when i clicked on the first hyperlink. there were no popup when i clicked on subsequent links

 $(document).ready(function(){

$("a#toggleFruitSlideBox").click(function() {
          alert($(this).text());
      return false;
  });
});

<div id="bodykit_slidebox">
<div style="padding:5px 0px 0px 5px;">
    <a id="toggleFruitSlideBox" href="#" class="nav2">apple</a>
    <a id="toggleFruitSlideBox" href="#" class="nav2">orange</a>
    <a id="toggleFruitSlideBox" href="#" class="nav2">DURIAN</a>
    <a id="toggleFruitSlideBox" href="#" class="nav2">papaya</a>
</div>

解决方案

You have multiple elements with the same id it is an invalid HTML!

Check my answer here:
jQuery id selector works only for the first element

The only difference between your code and the code in the other question is that you use a bad selector:

$("a#toggleFruitSlideBox")

Which cause jQuery not to use the document.getElementById, so this is why it works in other browsers.

From the jQuery docs:

For id selectors, jQuery uses the JavaScript function document.getElementById(), which is extremely efficient. When another selector is attached to the id selector, such as h2#pageTitle, jQuery performs an additional check before identifying the element as a match.

Remove the duplicated id and use other selector like the class selector.

这篇关于IE上的jquery多个切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！