如何让 jquery 在 WAMPserver 上工作？答案

【问题标题】：How to get jquery to work on WAMPserver?如何让 jquery 在 WAMPserver 上工作？
【发布时间】：2015-03-10 08:22:11
【问题描述】：

我是一个 jquery 初学者，我已经设置了一个 wamp 服务器来练习 html 和 jquery，但我似乎无法让 jquery 工作。我写了一个简单的jquery代码来测试它。

这是我的html代码：

<!doctype html>
 <html >
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>


<body>

<div id= "wrapper">

<div class="intro"><BUTTON type="button">Who am I?</BUTTON></div>
<div class="contact"><BUTTON type="button">What am I?</BUTTON></div>
<div class="exp"><BUTTON type="button">Experience</BUTTON></div>

<div/> 
</body>
</html>

jquery.js 代码：

$(document).ready(function(){
    $('.intro').onClick(function(){
        $(this).fadeOut('slow', 300);
            });
        });

我不确定正确链接我的 jquery 页面是问题还是 wamp 服务器。

【问题讨论】：

标签： html wampserver

【解决方案1】：

第一个 WAMPServer 与 jQuery 代码关系不大，只是将其提供给浏览器，因此它不是 WAMPServer 问题。

jquery 代码有一些问题。

首先没有onClick函数，你应该使用click所以

$('.intro').onClick(function(){

应该变成

$('.intro').click(function(){

其次，此持续时间可以是"slow"，表示 600 毫秒或毫秒数。你已经使用了这两个，那是无效的。实际上参数 2 应该是一个回调函数，当淡入淡出完成时会运行。所以

$(this).fadeOut('slow', 300);

变成

$(this).fadeOut('slow', function(){
    // fade complete, 
    // you dont have to do anything in here if you dont want to
});

事实上，如果在淡入淡出完成后你不打算做任何事情，你甚至不必使用第二个参数。所以可以写成

$(this).fadeOut('slow');

因此，考虑到所有这些，您的脚本会稍微重新编码

$(document).ready(function(){
    $('.intro').click(function(){
        $(this).fadeOut('slow', function(){
            // done
        });
    });
});

如果你不想在淡入淡出完成后做任何事情，或者可能是一个更好的解决方案

$(document).ready(function(){
    $('.intro').click(function(){
        $(this).fadeOut('slow');
    });
});

这应该可以按您的预期工作。

基本上你需要仔细看看这里的JQuery manual

【讨论】：

好的，我已经按照您的指示进行操作，但 jquery 仍然无法正常工作。 html: