Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • What is JQuery noConflict method?

    • 0
    • 0
    • 0
    • 0
    • 1
    • 0
    • 0
    • 0
    • 221
    Comment on it

    As jQuery do most of the JavaScript libraries use $ as a function or variable name. In jQuery's case, all functionality is available without using $ because it is just an alias for jQuery. In jQuery we can return control of $ back to the other library with a call to noConflict() if we are using another JavaScript library alongside jQuery. We can prevent a conflict by using use two different jQuery releases.

    jQuery noConflict() can be used by below example. On the left side of the page the script is same. The changed scripts with additions/substitutions shown in red are on the right side. To these examples, your scripts will be different , but the meaning is the same. As shown below you have to insert lines of code. Scripts to noConflict only change the jQuery . Before changing anything please insure that your scripts function individually before changing anything.


    To give control of the $ variable back to whichever library first implemented it will basically run $.noConflict() method . If we want that jQuery library doesn't conflict with other libraries we use the jQuery conflict method this gives the surety to us.

    Normally we do like this.

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2 /jquery.min.js"></script>
    
     
    
    <script type='text/javascript'>
    
     
    
    $(window).load(function(){
    
    $(document).ready(function(){
    
          $('#article').width(250);
    
          $('#article').mouseover(function()
    
          {
    
             $(this).css("cursor","pointer");
    
             $(this).animate({width: "400px"}, 'slow');
    
          });
    
       $('#article').mouseout(function()
    
         {   
    
             $(this).animate({width: "400px"}, 'slow');
    
          });
    
      });
    
    });  
    
    </script>

     

    Here $m variable is assigned within the script so that all the $ sign in the script are replaced by $m.

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2 /jquery.min.js"></script>
    
     
    
    <script type='text/javascript'>
    
    var $j = jQuery.noConflict();
    
    $j(window).load(function(){
    
    $j(document).ready(function(){
    
          $j('#article').width(250);
    
          $j('#article').mouseover(function()
    
          {
    
             $j(this).css("cursor","pointer");
    
             $j(this).animate({width: "400px"}, 'slow');
    
          });
    
       $j('#article').mouseout(function()
    
         {   
    
             $j(this).animate({width: "400px"}, 'slow');
    
          });
    
      });
    
    });  
    
    </script>

     

     

 1 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: