使用jQuery显示在Chrome扩展程序弹出窗口中隐藏div

Question

我一直试图在我的浏览器操作弹出窗口中显示并隐藏选项（可能会切换），但没有成功。 下面的代码是我弹出的身体

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="popup.js"></script> 
<div class="show"> 
    <a href="#" class="showcontent">Show</a> 
    <a href="#" class="hidecontent">Hide</a> 
    <div class="somecontent"> 
     <p>some content<br /> 
      <a href="#">Link</a><br /> 
     </p> 
    </div> 
</div> 

的popup.js文件包含，除其他事项外：

$(document).ready(function(){ 
    $(".somecontent").hide(); 
    $(".showcontent").click(function(){ 
     $(".somecontent").show(); 
    }); 

    $(".hidecontent").click(function(){ 
     $(".somecontent").hide(); 
    }); 
}); 

我认为，问题是，Chrome的API是有我的弹出问题.js文件。正文出现在我的弹出窗口中，但“显示”和“隐藏”操作不起作用。任何想法如何使这项工作，如果没有，另一种方式来获得相同的结果（即：点击切换）？

编辑：从JavaScript控制台，我得到这个错误的错误：

Uncaught TypeError: Cannot call method 'ready' of null

指向使用准备功能上面的代码行。

Answer 1

popup popup.js可能导致解析/执行错误？尝试看是否铬可与打印错误：

JavaScript Console: click the Page menu icon and select Developer - JavaScript Console. From here, you'll be able to view errors in the JavaScript execution, and enter additional JavaScript commands to execute.

JavaScript Debugger: available as Page menu icon 0 Developer - Debug JavaScript, the debugger provides a command prompt from which you can set breakpoints, backtrace, and more. Type help at the debugger command line to get started.

从here

的错误你有可能会发生，如果没有加载的jQuery：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 

<script>alert($(document))</script> 

应该弹出的对象......

Answer 2

既然您既没有从您的点击处理程序返回false，也没有调用preventDefault()，页面将在点击时重新加载并且.somecontent将再次隐藏。更改您的JS为以下内容：

$(document).ready(function(){ 
    $(".somecontent").hide(); 
    $(".showcontent").click(function(){ 
     $(".somecontent").show(); return false; 
    }); 

    $(".hidecontent").click(function(){ 
     $(".somecontent").hide(); return false; 
    }); 
}); 

Answer 3

该错误表示jQuery未被正确加载。检查以确保它名为jquery.js并存储在根文件夹中。

Answer 4

你的代码适合我。正如其他人说，你听到的错误听起来像jquery.js文件没有被发现/加载。 这是一个远射，但如果您在Windows上，请检查jquery.js文件的属性，并查看第一个选项卡上是否有解除阻止按钮。点击它。

Answer 5

因为看起来这个老问题还没有回答，所以我想我会试试我的运气。

您是否尝试过再次下载jquery.js（文件可能已损坏）。另外，如果你仍然有兴趣解决它，你可以张贴你的src在某处供我们阅读（如http://jsfiddle.net/）

Answer 6

也可能是jQuery与页面中的其他内容冲突使用$()函数。 （我自己就遇到了这个问题。）如果是这种情况，将$()调用更改为jQuery()即可解决问题。