简单的Jquery功能不起作用

Question

这个简单的功能不起作用。 显示以下错误

'myfunc'未定义

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(document).ready(function(){ function myfunc(){ alert('In'); } }) </script> <button type="button" onclick="myfunc()">Alert</button> 

Answer 1

这是一个范围问题，myfunc不在全球范围内。 当你把它放在$(document).ready()你只能在document.ready()回调中调用它。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  //this doesn't need to be in document.ready(), it won't get called until button is already loaded anyway
  function myfunc() {
    alert('In');
  }
</script>
<button type="button" onclick="myfunc()">Alert</button>

您可以在http://www.w3schools.com/js/js_scope.asp上阅读有关JS如何在JS中工作的更多信息

Answer 2

存在问题的原因是您等待创建函数直到文档准备就绪。 加载所有DOM元素后，文档就会准备就绪。 因此，在创建函数之前，需要加载按钮。

该按钮尝试加载，但无法找到该功能。 这是因为它尚未创建。 您应该替换document.ready ()之外的函数，以便在加载DOM元素之前创建函数。

Answer 3

 $(document).ready(function() { $("#btn").click(function() { alert('Button Clicked') }) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button type="button" id="btn">Alert</button> 

您可以像这样将事件附加到按钮。 然后只是提醒任何事情

Answer 4

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>   $(document).ready(function(){
function myfunc(){
  alert('In');
}   });/*don't forget ;*/ 
</script> <button type="button" onclick="myfunc()">Alert</button>

Answer 5

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> function myfunc(){ alert('In'); } $(document).ready(function(){ }) </script> <button type="button" onclick="myfunc();">Alert</button> 

Answer 6

这是一个基本的JavaScript问题：您的函数myfunc对于未命名的“onload”jquery函数是私有的。

一般来说 - 假设你仍然想在“onload”函数中定义你的函数 - 你可以这样做（ a()是“onload”函数而b()是你的myfunc() ）：

var b; // without this line it would still work, since
       // b would implicitely become a global variable in a()
function a(){
    // function b(){ ... would *not* work here
    b=function(){
      alert('In');
    }
}
a();
b();

现在，回到你的实际问题：@guradio提供的解决方案肯定是最好的前进方式，使用jquery以一种它的方式使用。