$是不確定的，但加載jQuery的兩次修復它

我有一個在我的HTML文件中加載一個jQuery的預加載：

<script type="text/javascript"> 
     jQuery.noConflict()(function($){ 
      $(".view").preloader(); 
      $(".flexslider").preloader(); 
      }); 
</script>

我jquery.preloader.js

// JavaScript Document 
$.fn.preloader = function(options){ 

    var defaults = { 
        delay:200, 
        preload_parent:"a", 
        check_timer:300, 
        ondone:function(){ }, 
        oneachload:function(image){ }, 
        fadein:500 
        }; 

    // variables declaration and precaching images and parent container 
    var options = $.extend(defaults, options), 
    root = $(this) , images = root.find("img").css({"visibility":"hidden",opacity:0}) , timer , counter = 0, i=0 , checkFlag = [] , delaySum = options.delay , 

    init = function(){ 

     timer = setInterval(function(){ 

      if(counter>=checkFlag.length) 
      { 
      clearInterval(timer); 
      options.ondone(); 
      return; 
      } 

      for(i=0;i<images.length;i++) 
      { 
       if(images[i].complete==true) 
       { 
        if(checkFlag[i]==false) 
        { 
         checkFlag[i] = true; 
         options.oneachload(images[i]); 
         counter++; 

         delaySum = delaySum + options.delay; 
        } 

        $(images[i]).css("visibility","visible").delay(delaySum).animate({opacity:1},options.fadein, 
        function(){ $(this).parent().removeClass("preloader"); }); 




       } 
      } 

      },options.check_timer) 


     } ; 

    images.each(function(){ 

     if($(this).parent(options.preload_parent).length==0) 
     $(this).wrap("<a class='preloader' />"); 
     else 
     $(this).parent().addClass("preloader"); 

     checkFlag[i++] = false; 


     }); 
    images = $.makeArray(images); 


    var icon = jQuery("<img />",{ 

     id : 'loadingicon' , 
     src : '/assets/images/front/spinner.gif' 

     }).hide().appendTo("body"); 



    timer = setInterval(function(){ 

     if(icon[0].complete==true) 
     { 
      clearInterval(timer); 
      init(); 
      icon.remove(); 
      return; 
     } 

     },100); 

    }

但是當我運行這個，我得到一個「$未定義」，並指出這條線：

var options = $.extend(defaults, options),

但這裏的怪異的事情 - 如果我在HTML載入的jQuery 1.7.2 TWICE文件 - 錯誤消失，一切按預期工作（包括預加載器）。

問題：我該如何解決這個問題，所以我不需要兩次加載jQuery來使這個工作？

來源

2012-05-26 Laurence

你確定要加載的jQuery您加載其他腳本之前？ –

preloader.js應該處於就緒狀態。

(function($) { 
    $.fn.preloader = function(options) { 
     // your code here. 
    } 
})(jQuery);

來源

2012-05-26 14:41:58 Jivings

對不起 - 哪個位準確？我有點困惑？ – Laurence

@Laurencei我已經編輯了一些答案，以幫助您確定哪些代碼會在那裏進行 –

@Jack非常感謝。 – Jivings

你執行noConflict指令，這使得jQuery的重新綁定$其原始值（通常undefined）。刪除.noConflict()。或者，改寫$.extend到jQuery.extend（無衝突模式外，$只是爲jQuery的簡寫代名詞），$(this)到jQuery(this)等

來源

2012-05-26 14:42:21 Amadan

如果我將「jQuery.noConflict（）（function（$）」更改爲「jQuery。（function（$）」我得到一個新的錯誤：XML過濾器應用於非XML值（function（a，b）{return new e.fn.init（a，b，h）;}）？ – Laurence

你還沒有發佈整個錯誤信息，所以我真的不知道它是指什麼，但行應該是'jQuery（function（）{...}）'或者等價的'$（function（）{...}）'（沒有這個圓點）因爲你不使用無衝突模式，也可以看到，也沒有必要接收'$'作爲回調的參數。 – Amadan

你有幾個問題：

你必須等待DOM在引用元素之前就已經準備好了。如果您提供的代碼不在主體標籤的末尾，那麼您需要將代碼放在document.ready區塊中。
當您使用jQuery.noConflict()時，不能再使用$來引用jQuery。您必須改用符號jQuery。
如果您想再次使用$，您可以在jQuery傳遞給自執行功能塊將分配jQuery功能塊，這將讓你有使用它裏面的$符號，但不與任何干擾其他代碼。

這是我的建議：

<script type="text/javascript"> 
    jQuery.noConflict(); 
    (function($){ 
     // you can now use $ here as a reference to jQuery 
     // again inside this function 
     $(document).ready(function() { 
      $(".view").preloader(); 
      $(".flexslider").preloader(); 
     }); 
    })(jQuery); 
</script>

來源

2012-05-26 15:42:56 jfriend00

$是不確定的，但加載jQuery的兩次修復它

回答

相關問題