jQuery.noconflict函数($)不起作用

时间:2014-07-30 16:43:29

标签: javascript jquery

我正在使用在noconflict模式下使用jQuery的CMS(这一点在这里并不重要)。

我已经阅读了多篇关于如何使用jQuery的文章,但我没有让函数方法起作用。

// the function way
(function ($){
    /* plugin code */
})(jQuery);

但如果我像下面这样做,然后使用$ j而不是$调用所有内容它确实有效:

var $j = jQuery;

我想要第一种工作方式,因为我不想将所有代码重写为$ j(它有多容易。

我正在使用的代码(可能问题确实存在于此处


( function( $ ) {

// LOAD THE PLAYER

    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    var done = false;
    var player;
    var videoId = 'A3PDXmYoF5U';
    var startSeconds = 5;
    var endSeconds = 293;
    var setVolume = 15;
    var suggestedQuality = 'large';
    function onYouTubeIframeAPIReady() {
          player = new YT.Player('player', {
          height:  ($(window).width() / 16) * 9 + 35,
          width: '100%',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
    }

    function onPlayerReady(evt) {
        player.loadVideoById({'videoId': videoId, 'startSeconds': startSeconds, 'endSeconds': endSeconds, 'suggestedQuality': suggestedQuality });
        evt.target.playVideo();
    }

    function onPlayerStateChange(event) {
        var done = false;

// SOUNDCHECK

        if (event.data == YT.PlayerState.PLAYING && !done) {
            if (player.isMuted()){
                $(".eq").addClass("mute");  
            }

            if (player.getVolume() > setVolume) {
                player.setVolume(setVolume);
            } 
            done = true;
        }

// LOOP

        if (event.data == YT.PlayerState.ENDED && !done) {
            player.seekTo(startSeconds, true);
            done = true;
        }
     }

} )( jQuery );

编辑:经过一些调试后,我得出结论,它不能骗到调用函数本身。这是我在代码中做错的事情。 DOES工作下的代码

( function( $ ) {

// FIRST WORD SELECTION

$(document).ready( function () {

var firstword = function($selector) {
    $($selector).each(function() {
        var node = $(this).contents().filter(function() {
            return this.nodeType == 3
        }).first(), text = node.text(), first = text.slice(0, text.indexOf(" "));

        if (!node.length)
            return;

        node[0].nodeValue = text.slice(first.length);
        node.before('<span>' + first + '</span>');
    })
}; 

firstword("#masthead li a, .logo-title");
});

} )( jQuery );

2 个答案:

答案 0 :(得分:2)

<强> Working plunker

我通过将所有事件处理函数包含到全局范围中来实现它。那应该够了。

(function($) {

  // LOAD THE PLAYER
  var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);


  var done = false;
  var player;
  var videoId = 'A3PDXmYoF5U';
  var startSeconds = 5;
  var endSeconds = 293;
  var setVolume = 15;
  var suggestedQuality = 'large';

  window.onYouTubeIframeAPIReady = function() {
    player = new YT.Player('player', {
      height: ($(window).width() / 16) * 9 + 35,
      width: '100%',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  window.onPlayerReady = function(evt) {
    player.loadVideoById({
      'videoId': videoId,
      'startSeconds': startSeconds,
      'endSeconds': endSeconds,
      'suggestedQuality': suggestedQuality
    });
    evt.target.playVideo();
  }

  window.onPlayerStateChange = function(event) {
    var done = false;

    // SOUNDCHECK

    if (event.data == YT.PlayerState.PLAYING && !done) {
      if (player.isMuted()) {
        $(".eq").addClass("mute");
      }

      if (player.getVolume() > setVolume) {
        player.setVolume(setVolume);
      }
      done = true;
    }

    // LOOP

    if (event.data == YT.PlayerState.ENDED && !done) {
      player.seekTo(startSeconds, true);
      done = true;
    }
  }

})(jQuery);

答案 1 :(得分:0)

看来YT播放器API要求onYouTubeIframeAPIReady函数在全局命名空间中可用。但是,通过将代码包装在匿名函数中,该函数仅在本地可用。您可以通过从匿名函数返回函数来解决这个问题。因此,以下内容应该可以解决您的问题:

onYouTubeIframeAPIReady = ( function( $ ) {
// LOAD THE PLAYER

    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    var done = false;
    var player;
    var videoId = 'A3PDXmYoF5U';
    var startSeconds = 5;
    var endSeconds = 293;
    var setVolume = 15;
    var suggestedQuality = 'large';
    function onPlayerReady(evt) {
        player.loadVideoById({'videoId': videoId, 'startSeconds': startSeconds, 'endSeconds': endSeconds, 'suggestedQuality': suggestedQuality });
        evt.target.playVideo();
    }

    function onPlayerStateChange(event) {
        var done = false;

// SOUNDCHECK

        if (event.data == YT.PlayerState.PLAYING && !done) {
            if (player.isMuted()){
                $(".eq").addClass("mute");  
            }

            if (player.getVolume() > setVolume) {
                player.setVolume(setVolume);
            } 
            done = true;
        }

// LOOP

        if (event.data == YT.PlayerState.ENDED && !done) {
            player.seekTo(startSeconds, true);
            done = true;
        }
    }

    return function () {
        player = new YT.Player('player', {
            height:  ($(window).width() / 16) * 9 + 35,
            width: '100%',
            events: {
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange
            }
        });
    };

} )( jQuery );