不能让动画在jquery中工作.我尝试了所有方法，但它对任何点击按钮都没有反应

Can't get animate to work in jquery. Iv'e tried everything but it just doesn't react to any button click

本文关键字：任何点 有反应 按钮 有方法 jquery 动画 工作 不能      更新时间：2023-09-26

problem=嗯，当我点击HTML页面上的菜单时，实际上什么也没有发生。什么都没有。是的，这是在完全讨厌的点，但我就是不能让它工作。我已经看了一遍，但它仍然没有任何作用。当alert工作时，jquery连接到html文件。但是有生命的东西却没有。

jquery和html CODE!

<div class="fgg">
    <ul>
        <li><a href="home.html">Home</a></li>
        <li><a href="product.html">Product</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
    <id class="button">Menu</id>
    <script>
        $('#button').click(function({$(".fgg").animate({down:'+=400px'})});
    </script>
</div>

CSS代码!

.fgg {
    font-family: "Courier New", Courier, monospace;
    font-size: 20px;
    text-decoration: none;
    padding-left: 200px;
    border-style: solid;
    border-color: black;
    position: relative;
}

#button {
    font-family: "Courier New", Courier, monospace;
    font-size: 35px;
    border-style: solid;
    border-color: black;
    position: relative;
}

对不起，我刚开始做这个，我甚至不知道如何创建一个代码块

您使用的代码有几个问题。

首先，你使用CSS选择器#button，它的目标是具有'button' ID的元素。从你发布的HTML中，你没有任何ID为"button"的元素。但是，您确实有一个带有'button'类的元素。由于是这种情况，您将需要将CSS选择器(在CSS和JavaScript代码中)更改为.button。你可以点击这里了解更多关于CSS选择器的工作原理。

其次，JavaScript代码中存在语法错误。jQuery的.click()函数接受一个函数作为参数，当指定的元素被点击时，这个函数将执行。一个简单的例子:

$('.button').click(function () {
    alert('Hello, world!');
});

在英语中，这可能读作"当带有'button'类的元素被单击时，我想显示一个警告，说'Hello, world!'"。

你当前代码的问题是你传递了一个代码块作为这个函数的参数，而不是在函数内部执行一些代码。差异可能很难发现，但这是一种模式，您将习惯于使用JavaScript更多。

换句话说，你希望你的代码看起来像这样:

$('.button').click(function () {
    $('.fgg').animate({
        // your options here
    });
});

(您可以阅读更多关于jQuery的.click()函数，并通过点击这里查看更多示例)

最后，.animate()的使用有一个问题。您指定了down的方向属性，但.animate()只理解top、bottom、right和left的方向属性。尝试使用其中一个，看看你是否能得到你想要的结果。您可以点击这里阅读更多关于.animate()工作原理的信息，并查看一些示例。

根本没有'down'这回事。使用"高级"。还要检查你是否正确地包含了JQuery(正确的链接，检查控制台是否有404错误等)。最后，将所有JQuery包围在一个文档中。Ready函数-如果没有，它可能无法在页面加载时正确运行(本质上这是一个很好的实践)。也只是注意到，你需要使用属性ID而不是类，当分配名称按钮的元素在html中，以便# (ID引用)选择它正确。

1个问题是你的函数没有正确编写(有语法错误)你忘记添加右括号了:错误:

$('#button').click(function({$(".fgg").animate({down:'+=400px'})});

: 

$('#button').click(function(){$(".fgg").animate({down:'+=400px'})});

如果仍然不工作，那么打印控制台显示的错误

相关文章：