減少Jquery noConflict的存在

Question

我編寫了一個代碼，我在其中調用jQuery.noConflict（）;多次。 如何減少jQuery.noConflict（）;存在，因爲我認爲這是不好的，該語句重複幾次

$glob = jQuery.noConflict(); 

      /* functions to run when content loads */ 
      $glob(document).ready(function(){ 

       var ht = $glob(window).height(); 

       $glob('.content').css({ 
        'height': ht, 
        'min-height': ht 
       }); 

       $glob('#page').css({ 
        'top':-ht 
       }); 
      }); 


      /* functions to run when page loads */ 
      function animateHorizontal2id(id,msg){ //the id to animate, the easing type 



       var $a = jQuery.noConflict(); // defined to remove jquery conflict error 
       var animSpeed=2000; //set animation speed 
       var page= $a("#page"); //define the page to move 

       var ht = $a(window).height(); 



       //do the animation 

       var archPos = $a(id).position().left;   

       $a('#architecture').css({ 
        'left': archPos 
       }); 



       page.stop().animate({"left": -($a(id).position().left)}, animSpeed 

            ); 

        $a('#page').css({ 
         'top': -ht 
        }); 
       //} 

      } 
      function animateVertical2id(id,msg) { 

       var $arct = jQuery.noConflict(); // defined to remove jquery conflict error 
       var animSpeed=2000; //set animation speed 
       var page= $arct("#page"); //define the page to move 
       //do the animation 

       page.stop().animate({"top": -($arct(id).position().top)}, animSpeed); 

      } 

      function animate2Home(id,msg) { 
       var $home = jQuery.noConflict(); // defined to remove jquery conflict error 

       var archPos = $home(id).position().left;    

       var ht = $home(window).height(); 
       $home('#page').css({ 
        'top': -ht 
       }); 

       $home('#architecture').css({ 
        'left': archPos 
       }); 


       var animSpeed=2000; //set animation speed 
       var page= $home("#page"); //define the page to move 
       //do the animation 
       page.stop().animate({"left": -($home(id).position().left)}, animSpeed); 
      } 

Answer 1

.noConflict()的要點是將jQuery重新分配給不同的全局域，然後在需要的時候引用新的全局域。您的代碼很容易被寫成這樣：

$glob = jQuery.noConflict(); 
/* functions to run when content loads */ 
$glob(document).ready(function() { 
    var ht = $glob(window).height(); 
    $glob('.content').css({ 
     'height': ht, 
     'min-height': ht 
    }); 
    $glob('#page').css({ 
     'top': -ht 
    }); 
}); 
/* functions to run when page loads */ 
function animateHorizontal2id(id, msg) { //the id to animate, the easing type 
    var animSpeed = 2000; //set animation speed 
    var page = $glob("#page"); //define the page to move 
    var ht = $glob(window).height(); 
    //do the animation 
    var archPos = $glob(id).position().left; 
    $glob('#architecture').css({ 
     'left': archPos 
    }); 
    page.stop().animate({ 
     "left": -($glob(id).position().left) 
    }, animSpeed); 
    $glob('#page').css({ 
     'top': -ht 
    }); 
    //} 
} 

function animateVertical2id(id, msg) { 
    var animSpeed = 2000; //set animation speed 
    var page = $glob("#page"); //define the page to move 
    //do the animation 
    page.stop().animate({ 
     "top": -($glob(id).position().top) 
    }, animSpeed); 
} 

function animate2Home(id, msg) { 
    var archPos = $glob(id).position().left; 
    var ht = $glob(window).height(); 
    $glob('#page').css({ 
     'top': -ht 
    }); 
    $glob('#architecture').css({ 
     'left': archPos 
    }); 
    var animSpeed = 2000; //set animation speed 
    var page = $glob("#page"); //define the page to move 
    //do the animation 
    page.stop().animate({ 
     "left": -($glob(id).position().left) 
    }, animSpeed); 
} 

這麼說，我真的很喜歡Allan Kimmer Jensen的解決方案，雖然我會寫它像這樣：

(function ($) { 
    // You can use $ safely in here with no conflicts. 
}(jQuery.noConflict())) 

Answer 2

你可以用它來過一次，做：

$(document).ready(function(){ 

    $.noConflict(); 

    //put your code here 

}); 

Answer 3

你可以包含它在這樣的功能：

jQuery.noConflict(); 
(function($) { 

    // You can use $ safely in here with no conflicts. 

})(jQuery); 

你也能做到這樣，如果你想讓它更緊湊：

jQuery.noConflict()(function(){ 
    // You can use $ safely in here with no conflicts. 
});