jQuery .hover（）和.click（）事件不起作用在IE 8中

我正在使用jquery作为下拉菜单，并且隐藏了网站上的帐户登录区域。它可以在Windows和Mac上的Firefox，Safari和Chrome中正常工作，但它不想在IE8中工作。（我没有测试9和10，但它必须运行在8）jQuery .hover（）和.click（）事件不起作用在IE 8中

这里是一个fiddle。

请忽略小提琴中的CSS - 它是压缩的。显然，子导航是隐藏的。

HTML：

<header> 
     <a href="/"><h1 class="logo col-4">GreyStone Power Corporation</h1></a> 
     <div class="login col-4"> 
      <form method="post" class="login-form"> 
       <p>Login to view/pay your bill:</p> 
       <fieldset> 
        <div class="rowElem col-6"><input type="text" id="username" name="username" placeholder="Username" class="col-10"/></div> 
        <div class="rowElem col-6"><input type="password" id="password" name="password" placeholder="Password" class="col-10"/></div> 
        <div class="rowElem col-5"><button formaction="#" class="orangeBtn">Log In <span class="arrow-right-icon"></span></button></div> 
        <div class="col-5 right inline register"><a class="block" href="#">Register</a><a class="block" href="#">Forgot Password</a></div> 
       </fieldset> 
      </form> 
     </div><!-- End Account Login --> 
     <nav> 
      <ul class="navigation col-10-exact"> 
       <li>Residential 
        <section class="sub-nav col-12"> 
         <ul class="sub-nav-list col-3"> 
          <a href="#"><li>View/Pay Bill</li></a> 
          <a href="#"><li>Apply For Service</li></a> 
          <a href="#"><li>Billing/Payment Options</li></a> 
          <a href="#"><li>Pre-paid</li></a> 
          <a href="#"><li>Rates</li></a> 
          <a href="#"><li>Energy Savings</li></a> 
          <a href="#"><li>Member Handbook</li></a> 
         </ul> 
         <div class="nav-info col-9 right"> 
          <p>Some Text/Other stuff here.</p> 
         </div> 
        </section> 
       </li> 
       <li>Commercial 
        <section class="sub-nav col-12"> 
         <ul class="sub-nav-list col-3"> 
          <a href="#"><li>View/Pay Bill</li></a> 
          <a href="#"><li>Apply For Service</li></a> 
          <a href="#"><li>Billing/Payment Options</li></a> 
          <a href="#"><li>Pre-paid</li></a> 
          <a href="#"><li>Rates</li></a> 
          <a href="#"><li>Energy Savings</li></a> 
          <a href="#"><li>Member Handbook</li></a> 
         </ul> 
         <div class="nav-info col-9 right"> 
          <p>Some Text/Other stuff here.</p> 
         </div> 
        </section></li> 
      </ul> 
      <ul class="account col-2-exact right"> 
       <li>My Account <span class="icon-acct"></span></li> 
      </ul> 
     </nav><!-- End Navigation --> 
    </header>

的jQuery：

$(document).ready(function(){ 
    $(".account").click(function(){ 
     $(".login").fadeToggle(300); 
    }); 
    $(".navigation > li").hover(function(){ 
     $(this).children(".sub-nav").toggle(); 
    }); 
});

来源

2013-10-08 Jacques

“不工作”意味着什么 - 什么都没有发生？浏览器控制台中报告的任何错误？小提琴指定不支持IE8或更旧版本的jQuery 2.0.2。 – nnnnnn

用'alert（“blah”）替换你的代码;'然后你就会知道事件是否被破坏或者它里面的代码。 –

“不工作”表示它不起作用。该事件不会触发。错误是“对象不支持这个属性或方法”return n ||（n = x.Deferred（），“complete”=== o.readyState？setTimeout（x.ready）:(o.addEventListener “DOMContentLoaded”，S，！1），e.addEventListener（“load”，S，！1））），n.promise（t）'是它引用的内容。 – Jacques

您需使用jQuery的1.x，2.x版本不他们在2.x中放弃了对旧版IE（6,7,8）的支持。

来源

2013-10-08 21:15:30

请注意，jquery 1.1x遵循相同的API，并与2.x一起更新，jquery并没有简单地放弃对旧版IE的支持。 –

@KevinB是的，我的意思是在2.x行。不知道如何让我的答案更清楚。 –

jQuery .hover（）和.click（）事件不起作用在IE 8中

回答

相关问题