本地html文件不会运行javascript（在任何浏览器上）
[英]Local html file wont run javascript (on any browser)
问题描述
I tries to search on Google but i'm not sure If any of the questions found really relate to my issue. 
我尝试在Google上进行搜索，但不确定是否找到任何与我的问题有关的问题。
It's very simple. 非常简单 I have here on my PC an html file with only a button on the screen. 我的PC上有一个HTML文件，屏幕上只有一个按钮。
I have the link to a .css file on the same folder as my html. 我在与HTML相同的文件夹中具有指向.css文件的链接。 The .css works well.. the properties of colors and shape are working. .css正常工作。.颜色和形状的属性正常工作。
And I also have a .js file with a code that should make a fadeout fadein effect on this button. 我还有一个.js文件，其中包含应在此按钮上产生淡入淡入效果的代码。
I'm learning HTML (and other stuff) on codecademy.com. 我正在codecademy.com上学习HTML（以及其他内容）。 They have a test environment there and my code works well. 他们在那里有一个测试环境，我的代码运行良好。
But locally (as I described) the javascript code won't run. 但是在本地（如我所述），JavaScript代码无法运行。 No fadeout-fadein effect. 无淡入淡出效果。
I tried on different browsers (Chrome, IE, Edge...) no deal. 我在不同的浏览器（Chrome，IE，Edge ...）上尝试过。 Also tried to open all the security on IE allowing active content and many other items. 还尝试打开IE上的所有安全性，允许活动内容和许多其他项目。
Below are my codes from html, .css and js: 以下是我来自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 file (Name of the file stylebotao.css) 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 file (Name of the file script,js) Javascript文件（文件脚本的名称，js）
$('div').mouseenter(function(){$(this).fadeTo('fast',1)});
$('div').mouseleave(function(){$(this).fadeTo('fast',0.1)})
What can I do about it? 我该怎么办？
2 个解决方案
解决方案1
0 2016-01-15 15:47:40
My guess is you didn't include jQuery, so the $ selector is not defined. 我的猜测是您没有包括jQuery，因此未定义$选择器。 So when you try $('div').mouseenter(function(){$(this).fadeTo('fast',1)}); 因此，当您尝试$('div').mouseenter(function(){$(this).fadeTo('fast',1)}); it gives an error telling you $ is not a function (which you'll be able to see if you open the console). 它给出一个错误，告诉您$不是函数（如果您打开控制台，您将能够看到它）。 So the solution would be to either use pure javascript or include jquery before your script. 因此，解决方案是使用纯JavaScript或在脚本之前包含jquery。
Btw: it's better to run your javascript after the DOM has completely loaded, so you are sure the elements you are referencing are there when the code runs. 顺便说一句：最好是在DOM完全加载后运行javascript，因此可以确保在代码运行时引用的元素在那里。 In jquery you can do it like this: 在jquery中，您可以这样操作：
$(function () {
//your code here
});
解决方案2
0 2016-01-15 16:27:12
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.