javascript - 我的脚本无法正常工作并且不会引发错误

标签 javascript jquery

我只是想用 jQuery 制作一个可以上下滑动的按钮,但它只能工作 50% 的时间。当我按“向上滑动”时,它确实起作用,但与“向下滑动”不起作用。它也没有给我任何错误...

这是我的代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script>
        var test = true
        var test2 = false
        if(test == true){
            $(document).ready(function(){
                $(".btn1").click(function(){
                    $("p").slideUp();
                });
            });
        }
        else if(test2 == false){
            $(document).ready(function(){
                $(".btn2").click(function(){
                    $("p").slideDown();
                });
            });
        }
        </script>
    </head>
    <body>
    <p>Hello Uranus</p>
        <button class="btn1">Slide up</button>
        <button class="btn2">Slide down</button>
    </body>
</html>

我认为我忽略了一些东西,或者我只是不擅长编码,但任何帮助将不胜感激!

最佳答案

您可以简单地使用 jQuery .slideToggle() :

$('.btn').on('click', function(){
    $('p').slideToggle();
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    
<p>Hello Uranus</p>
<button class="btn">Slide Up/Down</button>

关于javascript - 我的脚本无法正常工作并且不会引发错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42347482/

相关文章:

javascript - JS 密码表单检查

javascript - 根据 JavaScript 中给定的顺序进行排序

javascript - css 宽度和高度不起作用

jQuery:易于调整的工具提示,无需使用图像,并且免费用于商业用途

javascript - Slick.js:如何删除当前幻灯片?

javascript - NPM package.json 基/根属性?

javascript - Django模板: get dictionary's value based on the key that equals to certain tag's value

javascript - onBlur 不适用于 TextArea

javascript - Chrome 中的 slimscroll 鼠标单击和滚动问题

javascript - jQuery 重新加载 MySQL 输出(浏览器问题)