Jquery change $ and Jquery in jquery.js library

Question

how to rename $ and jQuery ?

I have created widget and which is used in 3rd party website.

As i am getting conflict with jQuery with 3rd party website. And I don't aware about which version of jquery 3rd party is using so i am stuck at this point.

so now if it is possible to rename ,then let me know how to do it in jquery.js library.

Otherwise i have to rewrite whole my script (about 3000+ lines) in native java script. and this is not possible because my script using third party js like fullcalendar, colorbox, validationengine etc. which fully dependent on jquery.

<html>
<head>
</head>
<body>
3rd party website
    <script src="jquery-1.5.js"></script>


    // My widget code : Start
    <script src="http://my-domain.com/my-widget.js"></script>

    <div id="my-result"></div>
    // My widget code : End

</body>
</html>

EDIT 1

<html>
    <head>
        <title>title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <script src="http://code.jquery.com/jquery.js"></script>
        <script type="text/javascript" src="script.js"></script>

        <div id="my-result"></div>

         <script src="js/jsapi" type="text/javascript"></script>

        <script type="text/javascript">           
            google.load('jquery', '1.5');
        </script>
        <!--<script src="http://code.jquery.com/jquery-migrate-1.2.1.js" type="text/javascript"></script>-->
    </body>


</html>

I actually wrote a library the other day that does something very similar: jQuarry — ssube
– ssube, Commented Feb 19, 2015 at 15:25
@ssube you know you can make that 'library' a one-liner, right? :) — Rory McCrossan
– Rory McCrossan, Commented Feb 19, 2015 at 15:27

Shlomi Komemi · Accepted Answer · 2015-02-19 15:42:51Z

7

it's not recommended to change code in the jquery file itself, just use no conflict:

<script src="jquery.js"></script>
<script>
    var $j = jQuery.noConflict( true );
    // $j will point to your jquery version
    $j('#somediv').show();
</script>

after seeing the last edit, you can surround your my-widget.js code with closure that way your code will know $ as your version as jquery:

(function( $ ) {

    // all my-widget.js code 

})($j);

edited Feb 19, 2015 at 15:42

answered Feb 19, 2015 at 15:28

Shlomi Komemi

5,5453 gold badges31 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Yatin Mistry Over a year ago

@shlomikomemi I have update the code and used $jy instead of $j and getting error "Uncaught TypeError: Cannot read property 'close' of undefined" with $jy.colorbox.close(); how to deal with this.

Yatin Mistry Over a year ago

It is conflicting with 3rd party script datepicker and validationengine. they are also using $ or jQuery. How to deal with it?

Shlomi Komemi Over a year ago

use $jy in all the places also at the end of the closure line : (function( $ ) { })($jy);

Yatin Mistry Over a year ago

I have update the code in some plugins validationengine, colorpicker, etc and it is working. But Can you guide me how can i update jquery variable in jquery-ui.min.js code.jquery.com/ui/1.11.1/jquery-ui.min.js

Yatin Mistry Over a year ago

I have also fixed the jquery-ui-min.js issue. And Now your are idea is going to work. But After declare var $jy = jQuery.noConflict( true ); my 3rd party client script not working. At client end TypeError: $.browser is undefined.

|

Collectives™ on Stack Overflow

Jquery change $ and Jquery in jquery.js library

EDIT 1

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

EDIT 1

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related