jQuery插件初始化函数未执行

时间:2016-12-02 13:48:17

标签: javascript jquery

由于某些原因,当我调用我的jQuery插件时,初始化函数没有被调用,这似乎在我创建的另一个插件上按预期工作。

插件:

(function($) {
    $.fn.youtubeVids = function( options ) {
        var settings = $.extend({
      num: 1,
      id: 'UCeNOYP-TQK-3P3JZerCjheQ',
      elm: null
    }, options );

        function initialize() {
            console.log('dsad');
      $.ajax({
            url: "channel-videos.php",
            data: { num: settings.num, id: settings.id },
            success: function(data) {
                if (settings.elm !== null) {
                    console.log("test");
                } else {
                    console.log("uh oh");
                }
            },
            dataType: "json"
        });
        }
    };
}(jQuery));

调用插件:

<script src="/js-src/youtube-min.js"></script>
<script>
$("#vid1").youtubeVids({
  num: 3,
  elm: [ "#vid1", "#vid2", "#vid2" ]
});
</script>

1 个答案:

答案 0 :(得分:2)

initialize函数中的youtubeVids函数永远不会被调用,所以基本上没有任何事情发生(除了创建settings变量和initialize函数。

你应该在里面调用initialize函数:

(function($) {
  $.fn.youtubeVids = function( options ) {
    var settings = $.extend({
      num: 1,
      id: 'UCeNOYP-TQK-3P3JZerCjheQ',
      elm: null
    }, options );

    function initialize() {
      console.log('dsad');
      $.ajax({
        url: "channel-videos.php",
        data: { num: settings.num, id: settings.id },
        success: function(data) {
          if (settings.elm !== null) {
            console.log("test");
          } else {
            console.log("uh oh");
          }
        },
        dataType: "json"
      });
    }
    initialize();
  };
}(jQuery));

$("#vid1").youtubeVids({
  num: 3,
  elm: [ "#vid1", "#vid2", "#vid2" ]
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="vid1"></div>