显示和隐藏在 Jquery 中不起作用答案

【问题标题】：Show and hide not working in Jquery显示和隐藏在 Jquery 中不起作用
【发布时间】：2017-09-22 04:08:35
【问题描述】：

我是第一次使用 Jquery 和 JqueryUI。我有一个名为front 的div，我想在窗口加载时显示它，并在延迟5500 后通过滑动它来隐藏它。但它在 jquery.min.js 中给出错误。

HTML 代码是`

<head>
  <style> 
    #front {
      width: 400px;
      height: 400px;
      display: none;
    }
  </style>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">
  </script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
</head>



<body>
    <div id="front"> </div>

<script>
  function slider() {
    $("#front").show("fade",500);
    $("#front").delay(5500).hide("slide",{direction:"right"},500);
  }
  window.onload = function () {
    slider();
  }
</script>
</body>
</html>

jsfiddle https://jsfiddle.net/t29rh9sL/1/
我得到的错误信息是

未捕获的类型错误：r.easing[this.easing] 不是函数
在 init.run (jquery.min.js:3) 在我 (jquery.min.js:3) 在 Function.r.fx.tick (jquery.min.js:3) 在 eb (jquery.min.js:3)

【问题讨论】：

错误是什么？您是否在页面中包含 jqueryui.js？它是 jquery.js 的一个单独文件
"div named front" vs. div id="front"?
@RoryMcCrossan 是的，你是对的，我在 HTML 页面中添加了 CDN 链接。并且错误在 jquery.min.js 中，我不知道但在检查时显示 ---->>> "" jquery.min.js:3 Uncaught TypeError: r.easing[this.easing] is not a function at init.run (jquery.min.js:3) at i (jquery.min.js:3) at Function.r.fx.tick (jquery.min.js:3) at eb (jquery.min.js:3) ""
如果你想使用 jQuery.UI 在 jQuery.UI 之前包含 jQuery.js
好的@swapnilsolanke 尝试.....但同样的事情发生了。

标签： javascript jquery html css jquery-ui

【解决方案1】：

您的代码中没有 id 名称 #mainContainer。

你应该把 id 放在 body 中 <body id="mainContainer"><div id="front"> </div></body>

【讨论】：

很抱歉，这只是输入错误。问题已解决。我有错误的包含资源文件的顺序。不过还是谢谢。