Использование разных версий Jquery без конфликтов - PullRequest
0 голосов
/ 02 апреля 2012

Итак, начнем с ситуации. У меня есть веб-сайт, который использует Jquery 1.4.2 в качестве основной версии Jquery. Но пользователь может использовать пользовательские шаблоны, которые используют другие версии (1.2.1,1.5.1 и т. Д.). Так что в некоторых ситуациях это приводит к конфликтам.
Например, здесь

//included in my main view
<script type="text/javascript" src="jquery-1.4.2.min.js" ></script>
<script type="text/javascript">
        $(function () {
              alert($().jquery);
          });
</script>

//included in custom template
<script type='text/javascript' src='jquery-1.5.1.min.js'></script>
<script type="text/javascript">
        $(function () {
          alert($().jquery);
        });
</script>

Таким образом, они оба оповещают 1.5.1 (из-за инициализации, когда документ готов). Поэтому я хочу предотвратить эту ситуацию.

Теперь у меня в голове только одно решение - используйте noConflict(true) и замените все символы $ и Jquery на новые символы в всех плагинах, используемых на моем сайте.
Есть ли более элегантное решение или мне действительно нужно переименовать все плагины, используемые на моем сайте?

P.S. Другим способом, возможно, будет использование плагинов обратной совместимости, но в этой ситуации мне потребуется добавить множество плагинов, чтобы сделать его совместимым со всеми версиями.

1 Ответ

5 голосов
/ 02 апреля 2012

Посмотрите на jQuery.noConflict ()

**//included in my main view**
<script type="text/javascript" src="jquery-1.4.2.min.js" ></script>
<script type="text/javascript">
        $(function () {
              alert($().jquery);
          });
</script>

**//included in custom template**
<script type='text/javascript' src='jquery-1.5.1.min.js'></script>
<script type="text/javascript">
        $151 = jQuery.noConflict();
        $151(function ($) { // In this scope $ === $151, or jQuery 1.5.1
          alert($().jquery);
          // $ !== jQuery.
          // $().jquery = 1.5.1
          // jQuery().jquery = 1.4.2
        });
        // outside the scope
        // $ === jQuery
        // $().jquery returns 1.4.2
</script>

Как использовать jQuery.noConflict ();

$.noConflict() возвращает копию jQuery, вы можете записать в нее переменную следующим образом:

var j = $.noConflict()

HTML:

<script type="text/javascript" src="jquery-1.4.2.min.js" ></script>
<script type='text/javascript' src='jquery-1.5.1.min.js'></script>

JavaScript:

// jQuery === $
//$().jquery === 1.5.1

.

jQ151 = $.noConflict();

.

// jQ151 !== $
// jQ151().jquery === 1.5.1
// $().jquery === 1.4.2

в jQuery.ready(function() {.. или просто jQuery(function() {.. первый аргумент является локальной копией jQuery:

<script type="text/javascript" src="jquery-1.4.2.min.js" ></script>
<script type="text/javascript">
    jQuery(function($) {
        // in this scope $ refers to jQuery version 1.4.2
    });
</script>
<script type='text/javascript' src='jquery-1.5.1.min.js'></script>

<script type="text/javascript">
    jQuery(function($) {
        // in this scope $ refers to jQuery version 1.5.1
    });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...