未捕获的TypeError：.slideToggle不是函数

Question

我在同一个地图中的另一个文件中有jquery，我使用下面的代码来激活.slideToggle函数。但它不起作用，为什么？

jQuery(document).ready(function ($) {

    // get li items
    var ul = document.getElementById("menu-footermenu");
    var items = ul.getElementsByTagName("li");

    // display 5 li items, hide others
    for (var i = 0; i < items.length; ++i) {
        if (i > 5) {
            items[i].style.display = "none"
        }
    }

    // when clicking on more catogories button, display all items
    $('#morecat').click(function () {
        for (var i = 0; i < items.length; ++i) {
            if (i > 5) {
                items[i].slideToggle();
                document.getElementById("morecat").style.display = "none";
            }
        }
    });
});

我收到错误：

  

未捕获的TypeError：.slideToggle不是函数

Answer 1

请确保不要使用jquery的 slim 版本，这会排除动画之类的效果。

Answer 2

问题是因为items的内容是Element对象，而不是jQuery对象，因此slideToggle()函数不可用。

要解决此问题，您需要转换它们：

$(items[i]).slideToggle();

或者，您可以将所有逻辑转换为使用jQuery，而不是现在拥有的相当奇怪的半/半解决方案：

jQuery(function ($) {
  var $ul = $("#menu-footermenu");
  var $items = $("li");
  $items.filter(':gt(4)').hide();

  $('#morecat').click(function () {
    $items.filter(':gt(4)').slideToggle();
    $(this).hide();
  });
});