Question

我尝试在Google上搜索，但我不确定如果发现的任何问题与我的问题有关。

这非常简单。我在我的电脑上有一个html文件，屏幕上只有一个按钮。

我在与html相同的文件夹上有.css文件的链接。 .css效果很好..颜色和形状的属性正在起作用。

我还有一个带有代码的.js文件，该代码应该对此按钮产生淡出效果。

我在codecademy.com上学习HTML（和其他东西）。他们有一个测试环境，我的代码运行良好。

但是本地（正如我所描述的）javascript代码不会运行。没有淡出 - 淡化效果。

我试过不同的浏览器（Chrome，IE，Edge ......）没有交易。还尝试打开IE上的所有安全性，允许活动内容和许多其他项目。

以下是来自html，.css和js的代码：

HTML file (name of the file botao.html):
 <title> Button Magic </title>
     <link rel='stylesheet' type='text/css' href='stylebotao.css' >
     <script type='text/javascript' src='script.js'> </script>
 </head>
 <body>
     <div>  <br/>  strong Click me! </strong>  </div>
 </body>
 </html>

CSS文件（文件stylebotao.css的名称）

div  {
    height: 60px;
    width: 100px;
    border-radius: 5px;
    background-color: #69D2E7;
    text-align: center;
    color: #FFFFFF;
    font-family: Verdana, Arial, Sans-Serif;
    opacity: 0.5;
}

Javascript文件（文件脚本的名称，js）

$('div').mouseenter(function(){$(this).fadeTo('fast',1)});
$('div').mouseleave(function(){$(this).fadeTo('fast',0.1)})

我该怎么办？

Answer 1

我的猜测是你没有包含jQuery，因此没有定义$选择器。因此，当您尝试$('div').mouseenter(function(){$(this).fadeTo('fast',1)});时会发出错误，告诉您$不是一个函数（如果您打开控制台，您将会看到它）。所以解决方案是在你的脚本之前使用纯javascript或包含jquery。

顺便说一下：在DOM完全加载后运行你的javascript会更好，所以你确定代码运行时你引用的元素就在那里。在jquery中你可以这样做：

$(function () {
    //your code here
});

Answer 2

您必须包含jQuery文件/ cdn。 CDN 除非您知道自己在做什么，否则请尝试在身体标记的底部使用脚本。

＆＃13;

$( document ).ready(function() {
     //YOUR CODE HERE
  });

＆＃13;

本地html文件不会运行javascript（在任何浏览器上）

2 个答案: