函数未定义为我的简单按钮显示div javascript

问题描述:

对此的任何意见?当用户按下按钮时,最初隐藏的div必须显示在页面上。函数未定义为我的简单按钮显示div javascript

<!DOCTYPE html> 
    <html> 
    <head> 

    <style> 
     div { 
     display: none; 
     } 
    </style> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"> 
     function show() { 
       $("div").toggle(); 
     } 
    </script> 

    </head> 


    <body> 
    <p>Animals are cute!</p> 
    <div><p>Some text gonna blow up some pixels!</p></div> 
    <button onclick="show()">Click</button> 

    </body> 

    </html> 

在控制台中究竟写的错误:

ReferenceError: show is not defined[Learn More 
+0

你**必须**定义/把脚本在页面的底部。 –

+1

将函数放在另一个脚本标记中 –

移动内嵌脚本到它自己的标签。您不能在同一个标​​记中使用外部脚本和内联脚本。

所以:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
function show() { 
    $("div").toggle(); 
} 
</script> 

function show() { 
 
    $(".any-text").toggle(); 
 
}
.any-text { 
 
    display: none; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
      <p>Animals are cute!</p> 
 
      <div class="any-text"><p>Some text gonna blow up some pixels!</p></div> 
 
      <button onclick="show()">Click</button> 
 
    </body> 
 
</html>