0

我正在为最基本的 JQuery 魔法而苦苦挣扎：让它发挥作用。我有一个更大的 JQuery 文件，其中包含一些（以前的）功能性 javascript，但即使我将它归结为一个带有按钮的页面，一旦单击该按钮就会淡出，我的问题仍然存在。我只能假设我引用错误。

这是我的html

<!DOCTYPE html>
<html>
  <head>
     <script type="text/javascript" src="script.js"></script>
     <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
  </head>
  <body>
    <button>Make me vanish!</button>
  </body>
</html>

这是我的 script.js

$(document).ready(){
$('button').onclick(function(){
    $('button').fadeOut('fast');
});});

这是测试页面本身的链接（不起作用）： http: //folk.ntnu.no/benjamas/test.html

4

4 回答 4

5

您缺少 jQuery 本身。那，你需要颠倒你的脚本标签的顺序，因为你script.js依赖jQuery（它积极使用$符号）。

尝试这个：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="script.js"></script>

此外，您的 JS 本身是可疑的——您要么使用 DOMonclick处理程序，要么使用jQuery's $.click(). 不是两者的混合。

于 2013-05-21T16:43:31.117 回答
4

您需要在任何使用 jQuery 的脚本之前加载 jQuery：

 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
 <script type="text/javascript" src="script.js"></script>

而且您知道您只包含 jQuery UI，而不是库本身？

你的 JS 应该是这样的：

$(function(){
    $('button').on('click', function(){
        $(this).fadeOut('fast');
    });
});
于 2013-05-21T16:42:10.807 回答
2

您的脚本有错误，这是一个有效的：

$(document).ready(function() {
    $('button').click(function() {
        $('button').fadeOut('fast');
    });
});
于 2013-05-21T16:44:03.757 回答
1

第一：添加 jQ 库本身：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

然后在代码中试试这个：

<input class="button">Make me vanish!</input>

...

$('.button').on('click', function(){
    $('.button').fadeOut('fast');
});

它不必在 $(document) 对象 iirc 内；这是一种“听众”。

于 2013-05-21T16:44:02.020 回答