未应用 JQuery .hide 和 .show答案

【问题标题】：JQuery .hide and .show not being applied未应用 JQuery .hide 和 .show
【发布时间】：2020-03-08 04:27:14
【问题描述】：

Jquery .show 和 .hide 不起作用。如果有人可以帮助解决这个问题，那就太好了。我已经尝试了大多数事情，但无法弄清楚错误是什么。

<div class="splash-page"
        style="overflow: hidden; display: flex; flex-direction: column; width: 100%; align-items: center; height: 100vh; justify-content: center;">
        <div style="display: flex; width: 100%; justify-content: center;">
            <div id="left">
                <img src="" alt="logo">
            </div>
            <div id="right">
                <img src="" alt="logo">
            </div>
        </div>

            <div class="elementor-container elementor-column-gap-default">
function flipHomePage() {
    var $ = jQuery;
    $("#left").hide("slide", {
        direction: "left"
    }, 1000);
    $("#right").hide("slide", {
        direction: "right"
    }, 1000, function () {
        $('.splash-page').hide();
        $('.elementor-container.elementor-column-gap-default').show();
    });
}
if (jQuery('.page-id-19').length) {
    jQuery('.elementor-container.elementor-column-gap-default').hide();
}

【问题讨论】：

基本上我没有在你的代码中看到任何脚本标签。
我在您的代码中没有看到任何 id 为“left”或“right”的元素。你是用错了身份证还是我遗漏了什么？
@ShivratnaKumar 我已经为你编辑了这个
你添加了 jQuery UI 了吗？
$('#left').hide('slide', {direction: 'left'}, 1000); 需要 jQuery-ui 库。见jqueryui.com

标签： javascript html

【解决方案1】：

您缺少 <script></script> 标记和 $(function(){ [...] })(jQuery); 来初始化 jQuery 库。您必须像这样更改您的 Javascript 代码：

<script>
    $(function(){
        function flipHomePage()
            $("#left").hide("slide", {
                direction: "left"
            }, 1000);
            $("#right").hide("slide", {
                direction: "right"
            }, 1000, function () {
                $('.splash-page').hide();
                $('.elementor-container.elementor-column-gap-default').show();
            });
        }
        if ($('.page-id-19').length) {
            $('.elementor-container.elementor-column-gap-default').hide();
        }
    })(jQuery);
</script>

当然，您必须在 <head></head> 标签中包含 jQuery 脚本

【讨论】：