Question

我正在尝试在WordPress中添加lightslider（http://sachinchoolur.github.io/lightslider/index.html）但我收到错误

Uncaught TypeError: jQuery(...).lightSlider is not a function(anonymous function) @ (index):99m.Callbacks.j @ jquery.js?ver=1.11.2:2m.Callbacks.k.fireWith @ jquery.js?ver=1.11.2:2m.extend.ready @ jquery.js?ver=1.11.2:2J @ jquery.js?ver=1.11.2:2

我正在尝试使用他们网站上最简单的例子

HTML

<ul id="lightSlider">
  <li>
      <h3>First Slide</h3>
      <p>Lorem ipsum Cupidatat quis pariatur anim.</p>
  </li>
  <li>
      <h3>Second Slide</h3>
      <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
  </li>
  <li>
      <h3>Third Slide</h3>
      <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
  </li>

</ul>

的JavaScript

<script type="text/javascript">
//Also tried to add noConflict() function
//jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("#lightSlider").lightSlider(); 

});
</script>

有人能帮助我吗？谢谢！

Answer 1

我解决了问题。存在的问题是因为某种方式jQuery是在lightSlider.js之后加载的。我不知道这是怎么发生的，我只是先在wp_enqueue_script（）中加载jQuery，然后再加载（在css之前）和最后的lightslider.js。

我希望这个答案可以帮到更多人。谢谢你的帮助。

Answer 2

我有同样的问题，但我已修复它。只需复制lightslider.js的整个代码并将其过去：

$(document).ready(function(){
   //code of lightslider 

});

Answer 3

您应该首先将依赖项array('jquery')加载到jQuery中。

示例：

  wp_register_script( 'lightslider-js', get_stylesheet_directory_uri() . '/js/vendor/lightSlider/js/lightslider.min.js', array('jquery'), NULL, true );

Answer 4

添加延迟的负载

<script src="js/lightslider.js defer"></script>

lightSlider不是一个函数，wordpress

4 个答案: