无法在Firefox中使用jQuery脚本

时间:2009-04-27 18:05:54

标签: javascript jquery firefox safari

我的主页上有以下script

$(function () { // same as $(document).ready(function () { })
  // assuming we have the open class set on the H2 when the HTML is delivered
  $('li.drawer h2:not(.open)').next().hide();

  $('h2.drawer-handle').click(function () {
    // find the open drawer, remove the class, move to the UL following it and hide it
    $('h2.open').removeClass('open').next().hide();

    // add the open class to this H2, move to the next element (the UL) and show it
    $(this).addClass('open').next().show();
  });
});

它适用于Safari,但不适用于Firefox 3.08 / 3.1 beta3。

如何让上述jQuery脚本在Firefox中运行?

[编辑]

我的index.html的第一行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"/>
<link href="template.css" type="text/css" rel="stylesheet"/>
<title>Abc</title>

<script type="text/javascript" src="jquery.js" />  

<script type="text/javascript"> 

! - - - - Above Code is at Here - - - - - 

</script>

</head>

index.html的正文

<body>
<div class="mainbody">

<h1 class="myheader">Test</h1>
<p>Test</p>

<ul class="drawers">

   <li class="drawer">
      <h2 class="drawer-handle open">Contact info</h2>
      <ul>

         <li>name
         </li>

         <li>
            <div class="">aaa
            </div>
         </li>
      </ul>
   </li>

   <li class="drawer">
      <h2 class="drawer-handle">Unpublished</h2>
      <ul>
         <li class="italic">
            <i>A</i> (2009).
         </li>
         <li class="italic">
            <i>aaa</i> (2008).
         </li>
      </ul>
   </li>     

   <li class="drawer">
      <h2 class="drawer-handle">Recent projects</h2>
      <ul>
         <li class="italic">
            Websites
         </li>

         <li class="italic">
            Search
            <form action="http://www.google.com/cse" id="cse-search-box">
            <div>
               <input type="hidden" name="cx" value="8834479:1qd7hky6khe" />
               <input type="hidden" name="ie" value="UTF-8" />
               <input type="text" name="q" size="31" />
               <input type="submit" name="sa" value="Search" />
            </div>
            </form>
            <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en"></script>
         </li>

      </ul>
   </li>     

</ul>


</div>

</body>
</html>

4 个答案:

答案 0 :(得分:2)

它适用于Firefox 3.0.9

究竟什么不起作用?

答案 1 :(得分:2)

我的猜测是你有无效的HTML导致Firefox中的一些错误的DOM结构。但是如果不看你的代码就很难分辨。

答案 2 :(得分:1)

为什么jquery选择器中的标签是大写的?根据您的doctype,您使用的是XHTML,并且所有标记都必须是小写的。不确定这是否会有所作为,但你应该改变H2 =&gt; h2等。

答案 3 :(得分:1)

我通过替换以下

获得了在Firefox中运行的代码
<script type="text/javascript" src="jquery.js" /> 

<script type="text/javascript" src="jquery.js"></script>