Question

所以我有一些网站的javascript，但目前我可以让它工作的唯一方法是它与HTML混合在一起。我读过这是不好的做法，但我无法弄清楚如何让它作为头部的脚本工作。谁能帮我吗？我在这里阅读了大量类似的问题，但无法使其发挥作用。

谢谢你，亚历

这是我的代码：

<li><a href="#" class="about_button" onclick="$('.about_background, .about_close').fadeIn('fast') ">About</a></li>

然后通过添加：

再次将其淡出

<a href="#" class="about_close" onclick="$('.about_background').fadeOut('fast')"></a>

并且具有跨越页面宽度和高度的div，以便用户可以在任何地方单击，不确定这是否是一种好方法并且可以使用。

由于

Answer 1

我想你只是忘了准备好文件。

您需要的代码：

<head>
  <script type="text/javascript">
    $(document).ready(function(){
      $('.about_button').click(function(){ $('.about_background, .about_close').fadeIn('fast'); });
      $('.about_close').click(function(){ $('.about_background').fadeOut('fast'); });
    });
  </script>
</head>

Answer 2

使用

<script src="path/to/file.js"></script>

在HTML 5中你不需要指定类型，否则你需要指定type =“text / javascript”

Answer 3

使用jquery选择器来定位HTML元素并将侦听器放在它们上面：

$('.about_button').on('click', function() {
    $('.about_background, .about_close').fadeIn('fast')
})

$('.about_button')是用于定位元素的选择器。 on('click'在目标元素上设置onclick侦听器 function() { ... }是在侦听器被触发时将被调用的回调函数

Answer 4

在你的html中，你可以放置元素：

<li><a href="#" class="about_button">About</a></li>
<a href="#" class="about_close"></a>

然后在正文的底部放置一个js文件的引用（它应该在文件的底部而不是在头部，以便html首先加载，并且当你使用js绑定时元素已经准备好了事件处理程序给他们）

<script src="<file path>"></script>

在外部js文件中，您可以将事件处理程序绑定到它们：

$(".about_button").click(function(){
   $('.about_background, .about_close').fadeIn('fast') 
}
$(".about_close").click(function(){
   $('.about_background').fadeOut('fast')
}

使用Javascript淡入/淡出div

4 个答案: