Üzerinde çalıştığım bir proje, müşterilerin Web sayfalarında jQuery kullanılmasını gerektiriyor. Müşteriler, oluşturacağımız <script>bir parçacığı oluşturulmuş bir widget oluşturan birkaç öğe içeren bir kod kodu <script>ekleyeceklerdir <iframe>. Zaten jQuery'nin en son sürümünü kullanmıyorlarsa, bu, <script>Google'ın barındırdığı jQuery sürümü için de (büyük olasılıkla) a'yı içerecektir .

Sorun, bazı müşterilerin zaten jQuery'nin eski bir sürümünün yüklü olması olabilir. Bu, en azından oldukça yeni bir sürümse işe yarayabilir, ancak kodumuz jQuery kitaplığında yakın zamanda tanıtılan bazı işlevlere dayanır, bu nedenle bir müşterinin jQuery sürümünün çok eski olduğu durumlar olabilir. JQuery'nin en son sürümüne yükseltmelerini isteyemeyiz.

JQuery'nin yalnızca kodumuz bağlamında, müşterinin sayfasındaki herhangi bir kodu etkilemeyecek veya etkilemeyecek daha yeni bir sürümünü yüklemenin bir yolu var mı? İdeal olarak, belki jQuery varlığını kontrol edebilir, sürümü tespit edebilir ve çok eski ise, bir şekilde sadece kodumuz için kullanmak için en son sürümü yükleyebiliriz.

JQuery'yi <iframe>de içeren bir müşterinin etki alanına yükleme fikrimiz vardı, bu da <script>uygun olabilir gibi görünüyor, ancak bunu yapmanın daha zarif bir yolu olduğunu umuyorum (performans ve karmaşıklık cezaları olmadan bahsetmiyorum) ekstralar <iframe>).

Evet, jQuery'nin uyumsuz modu nedeniyle yapılabilir. http://blog.nemikor.com/2009/10/03/using-multiple-versions-of-jquery/

<!-- load jQuery 1.1.3 -->
<script type="text/javascript" src="http://example.com/jquery-1.1.3.js"></script>
<script type="text/javascript">
var jQuery_1_1_3 = $.noConflict(true);
</script>

<!-- load jQuery 1.3.2 -->
<script type="text/javascript" src="http://example.com/jquery-1.3.2.js"></script>
<script type="text/javascript">
var jQuery_1_3_2 = $.noConflict(true);
</script>

Sonra, yerine, ya $('#selector').function();yaparsınız .jQuery_1_3_2('#selector').function();jQuery_1_1_3('#selector').function();

Buna baktıktan ve denedikten sonra, aslında bir kerede birden fazla jquery örneğinin çalışmasına izin vermediğini gördüm. Etrafta aradıktan sonra bu sadece hile yaptı ve çok daha az kod olduğunu buldum.

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script>var $j = jQuery.noConflict(true);</script>
    <script>
      $(document).ready(function(){
       console.log($().jquery); // This prints v1.4.2
       console.log($j().jquery); // This prints v1.9.1
      });
   </script>

Sonra "j" sonra "j" ekleyerek tüm yapmanız gereken oldu.

$j(function () {
        $j('.button-pro').on('click', function () {
            var el = $('#cnt' + this.id.replace('btn', ''));
            $j('#contentnew > div').not(el).animate({
                height: "toggle",
                opacity: "toggle"
            }, 100).hide();
            el.toggle();
        });
    });

Http://forum.jquery.com/topic/multiple-versions-of-jquery-on-the-same-page adresinden alınmıştır :

• - onun "jquery.versionX.js" Orijinal sayfa yükler $ve jQueryversionX aittir.
• Siz şimdi "jquery.versionY.js" olarak adlandırıyorsunuz - şimdi $ve jQueryY sürümüne, artı _$ve _jQuerysürümX'e aitsiniz.
• my_jQuery = jQuery.noConflict(true);- şimdi $ve jQueryversionX'e ait _$ve _jQuerymuhtemelen null ve my_jQueryversionY.

Sayfanızda istediğiniz kadar farklı jQuery sürümüne sahip olabilirsiniz.

Kullanım jQuery.noConflict():

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script>
    var $i = jQuery.noConflict();
    alert($i.fn.jquery);
</script> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
    var $j = jQuery.noConflict();
    alert($j.fn.jquery);
</script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
    var $k = jQuery.noConflict();
    alert($k.fn.jquery);
</script> 

DEMO | Kaynak

JQuery'nin ikinci sürümünü yüklemek ve daha sonra orijinaline geri yüklemek veya daha önce yüklenmiş bir jQuery yoksa ikinci sürümü korumak mümkündür. İşte bir örnek:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
    var jQueryTemp = jQuery.noConflict(true);
    var jQueryOriginal = jQuery || jQueryTemp;
    if (window.jQuery){
        console.log('Original jQuery: ', jQuery.fn.jquery);
        console.log('Second jQuery: ', jQueryTemp.fn.jquery);
    }
    window.jQuery = window.$ = jQueryTemp;
</script>
<script type="text/javascript">
    console.log('Script using second: ', jQuery.fn.jquery);
</script>
<script type="text/javascript">
    // Restore original jQuery:
    window.jQuery = window.$ = jQueryOriginal;
    console.log('Script using original or the only version: ', jQuery.fn.jquery);
</script>

Her zaman jQuery en son veya son kararlı sürümlerini kullanmanız gerektiğini söylemek istiyorum. Ancak, diğer sürümlerle bazı işler yapmanız gerekiyorsa, o sürümü ekleyebilir ve $başka bir adla yeniden adlandırabilirsiniz . Örneğin

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>var $oldjQuery = $.noConflict(true);</script>

Eğer kullanarak bir şey yazarsanız buraya bakın $o zaman en son sürümü alırsınız. Ama eski ile bir şey yapmanız gerekiyorsa, sadece $oldjQueryyerine kullanın $.

İşte bir örnek

$(function(){console.log($.fn.jquery)});
$oldjQuery (function(){console.log($oldjQuery.fn.jquery)})

gösteri

Kesinlikle, evet yapabilirsin. Bu bağlantı, bunu nasıl başarabileceğinizle ilgili ayrıntıları içerir: https://api.jquery.com/jquery.noconflict/ .