Jquery Image单击不在IE中工作

Question

HI 在我的项目中，我有一个弹出式窗口的图像。 当用户点击图像的左侧部分时，它会将用户 重定向到page1.aspx。当用户点击图片的右侧部分 时，它会将用户重定向到page2.aspx。我为此使用了JQuery，它在Fire fox中的工作原理是 。但它在IE中不起作用。 可能是什么原因。任何帮助将不胜感激。

感谢

下面是代码

<script type="text/javascript"> 
swfobject.registerObject("inhalerVideo", "9.0.0", "expressInstall.swf"); 
/* jQuery Nonsense */ 
$(document).ready(function() 
{ 
    //!\: Slider nav thingy. 
    $("#link_one").click(function() 
    { 
     var aWidth = $(this).width(); 
     if($(this).hasClass("closed")) 
     { 
      $(this).removeClass("closed").addClass("open").animate({width: aWidth + 205 + "px"}, {queue: false, duration: "fast"}); 
      if($("#link_two").hasClass("open")) 
      { 
       var bWidth = $("#link_two").width(); 
       $("#link_two").removeClass("open").addClass("closed").animate({width: bWidth - 205 + "px"}, {queue: false, duration: "fast"}); 
       $("#link_two a").hide(); 
      } 
      $("a", this).show(); 
     } 
     else 
     { 
      $("a", this).hide(); 
      $(this).addClass("closed").removeClass("open").animate({width: aWidth - 205 + "px"}, {queue: false, duration: "fast"}); 
     } 
    }); 
    $("#link_two").click(function() 
    { 
     var aWidth = $(this).width(); 
     if($(this).hasClass("closed")) 
     { 
      $(this).removeClass("closed").addClass("open").animate({width: aWidth + 205 + "px"}, {queue: false, duration: "fast"}); 
      if($("#link_one").hasClass("open")) 
      { 
       var bWidth = $("#link_one").width(); 
       $("#link_one").removeClass("open").addClass("closed").animate({width: bWidth - 205 + "px"}, {queue: false, duration: "fast"}); 
       $("#link_one a").hide(); 
      } 
      $("a", this).show(); 
     } 
     else 
     { 
      $("a", this).hide(); 
      $(this).addClass("closed").removeClass("open").animate({width: aWidth - 205 + "px"}, {queue: false, duration: "fast"}); 
     } 
    }); 
    //!\: This could all be achieved with CSS. 
    $(".subnavonfirst").prev(".navoff").css("background-image", "url('images/nav_on_bg.gif')").children("a").css("color", "#fff"); 
    $(".subnavon").prev(".subnavofffirst").prev(".navoff").css("background-image", "url('images/nav_on_bg.gif')").children("a").css("color", "#fff"); 
    $(".subnavonlast").prev(".subnavoff").prev(".subnavofffirst").prev(".navoff").css("background-image", "url('images/nav_on_bg.gif')").children("a").css("color", "#fff"); 
    $(".subnavonlast").prev(".subnavofffirst").prev(".navoff").css("background-image", "url('images/nav_on_bg.gif')").children("a").css("color", "#fff"); 
}); 
</script> 

<!-- Main Content Container --> 
    <div id="mainContentContainer"> 

     <!-- Top Link Slider --> 
     <div id="headerContainer" class="printHide"> 
      <div id="headerLinkContainer"> 
       <div id="banner_container"> 
       <div id="link_one" class="sub closed"> 
      <img class="major" src="images/patient_info.gif" border="0" /> 
      <img class="minor" src="images/sub_nav.gif" border="0" /> 
      <a href="http://www.mysite.com/files/products/uspi_nicotrol_inhaler.pdf" class="inhaler" rel="external" target="_blank"><!-- --></a> 
      <a href="http://www.mysite.com/files/products/uspi_nicotrol.pdf" class="ns" rel="external" target="_blank"><!-- --></a> 
     </div> 
       <div id="link_two" class="sub closed"> 
      <img class="major" src="images/prescribe_info.gif" border="0" /> 
      <img class="minor" src="images/sub_nav.gif" border="0" /> 
      <a href="http://www.mysite.com/files/products/uspi_nicotrol_inhaler.pdf" class="inhaler" rel="external" target="_blank"><!-- --></a> 
      <a href="http://www.mysite.com/files/products/uspi_nicotrol.pdf" class="ns" rel="external" target="_blank"><!-- --></a> 
     </div> 
       <div id="link_three" class="open"><a href="#ISIContainer"><img src="images/isi.gif" border="0" /></a></div> 
       </div>    
      </div> 

     </div> 

Answer 1

可以选择使用imagemap试过吗？这样几乎所有的浏览器都支持它，包括IE。

如果您愿意，您还可以捕获<area>标记的click()事件。

编辑：在看着你的网站，也许你可以绑定到图像.major而不是.sub格div扩展功能。

它看起来像.sub DIV被拦截在IE中点击事件，但符合标准的浏览器明白.minor画面应该呈现“上面”的.sub股利。