时间戳

首页 > 解决方案 > jQuery 仅在单击指定元素时激活 .click()

javascript - jQuery 仅在单击指定元素时激活 .click()

问题描述

我正在尝试创建一个 cookie 通知，一旦用户单击“同意”（或取消，一旦我添加它），它将使用 .slideToggle（或 slideUp/Down）隐藏元素。

目前，当您单击页面上的任意位置时，该元素将滑动切换，而不仅仅是像我尝试做的那样单击“同意”按钮时。

我在 Wordpress.org 网站上执行此操作（我不确定这是否会影响它），而且我只是在学习 JavaScript/jQuery，所以如果我误解了 .click 或 .slideToggle 的工作原理，我深表歉意。

代码如下：

<style>
.test{
    display:inline-block;
    background-color:#000;
    color:#FFF;
    text-align:center;
    width:100%;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="cdn.jsdelivr.net/jquery.cookie/1.4.1/jquery.cookie.min.js"></script>

<script type="text/javascript">
    var agree=function(){getElementById("#agree")};
    $(agree).click(function(){
        $("#box").slideToggle();
    });
</script>

<div class="test" id="box">
    <p>We Use Cookies</p>
    <button id="agree" type="button">Agree</button>
</div>

标签： javascriptjquery

解决方案

这个agree函数从不返回任何东西。var agree=function(){getElementById("#agree")};此外，您永远不会调用该函数（仅传递对该函数的引用）。最后，您应该将 jquery 放在文档就绪事件中，以便在脚本运行之前加载整个页面。

试试这个javascript：

$(function() {
    $("#agree").click(function(){
        $("#box").slideToggle();
    });
});

推荐阅读