Jquery не работает с прототипом

<script src="jquery.js"></script>
<script>
    var $jq = jQuery.noConflict();
    $jq(document).ready(function(){
        alert("123");
        $jq("#redactor_content").redactor();
        alert("456");
    });
</script>
<script src="prototype.js"></script>
<script src="redactor.js"></script>

«redactor.js» — это WYSIWYG-редактор на основе JQuery: http://imperavi.com/download/redactor/get/ с этим источником:

...
(function($){
   // Initialization
   $.fn.redactor = function(options)
   { ... };
})(jQuery);
...

Когда комментирую "prototype.js" - все работает(вижу "123456").

С "prototype.js" - вижу только "123" и "редактор" не работает. (Это значит, что пространство имён работает правильно, да? Почему тогда не работает второй алерт?)

Когда я комментирую только $jq(document).ready(function(){ и перемещаю "redactor.js" перед вызовом (вызов "redactor()" без ожидания DOM) - тоже все нормально.

Я не понимаю принципа. После включения «jquery.js» я сначала перезаписываю «$», а затем включаю «prototype.js», чтобы избежать конфликтов. Но пространство имен Jquery каким-то образом все же пересекается с Prototype. Подозреваю, что ошибка где-то здесь: $jq("#redactor_content").redactor(); и надо сделать что-то типа: .redactor($jq);, но голову сломал и не могу догадаться.

PS: Да, я прочитал документацию ( http://docs.jquery.com/Using_jQuery_with_Other_Libraries ) и пробовал по разному( меняет местами библиотеки и пробует $.noConflict, jQuery(document).ready...). Написал пример, что все работает и есть некоторая ясность.

Мой второй вопрос: будут ли они работать вместе: jQuery(document).ready(function() и Prototype document.observe("dom:loaded", function(), и если НЕТ, как заставить работать вместе?

Спасибо.


conflict jquery ajax prototypejs
person Vladislav    schedule 09.10.2011    source источник
comment
Пробовали ли вы эту структуру для своего кода (не редактора) (function($){ // Code... })(jQuery);   -  person Idered    schedule 09.10.2011
comment
Да, я пытался сделать что-то вроде: ‹script› (function($){ $(document).ready(function(){ alert(123); $(#redactor_content).redactor(); alert(456); } ); })(jQuery); ‹/script› Но не помню, что было в результате. Просто не работать.   -  person Vladislav    schedule 09.10.2011
comment
Когда вы используете (function($){...})(jQuery);, вам не нужен $(document).ready(. Также помните, что вы должны загрузить redactor.js перед его использованием. Поэтому правильный порядок это: jQuery, редактор, прототип, ваш скрипт.   -  person Idered    schedule 09.10.2011
comment
Но этот $(document).ready( должен выполняться после загрузки DOM. Если я его уберу, то будет другой смысл.   -  person Vladislav    schedule 10.10.2011

Ответы (2)


arrow_upward
1
arrow_downward

Попробуйте заменить

<script>
    var $jq = jQuery.noConflict();
    $jq(document).ready(function(){
        alert("123");
        $jq("#redactor_content").redactor();
        alert("456");
    });
</script>

с участием

<script>
(function($){
    $(document).ready(function(){
        alert("123");
        $("#redactor_content").redactor();
        alert("456");
    });
})(jQuery);  
</script>
person Shef    schedule 09.10.2011
comment
К сожалению, я вижу только 123 :( ‹script src=/jquery-1.6.4.min.js›‹/script› ‹script› (function($){ $(document).ready(function(){ alert(123 ); $(#redactor_content).redactor(); alert(456); }); })(jQuery); ‹/script› ‹script type=text/javascript src=/prototype.js charset=utf-8›‹ /script› ‹тип сценария=текст/javascript src=/redactor.js›‹/script› - person Vladislav; 10.10.2011
comment
Без $(document).ready(function(){ - это работает, но мне нужно, чтобы код выполнялся, когда DOM полностью загружен - person Vladislav; 10.10.2011
comment
@Vladislav Вы должны включить jQuery, redactor.js, пользовательский скрипт, а затем прототип в этом порядке. - person Shef; 10.10.2011
comment
‹script src=//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js›‹/script› ‹script›window.jQuery || document.write('‹script src=/jquery-1.6.4.min.js›‹\/script›’)‹/script› ‹script type=text/javascript src=/redactor.js›‹/script› ‹ script› (function($){ $(document).ready(function(){ alert(123); $(#redactor_content).redactor(); alert(456); }); })(jQuery); ‹/script› ‹script type=text/javascript src=/prototype.js charset=utf-8›‹/script› Нет никакой разницы. Я вижу только 123. - person Vladislav; 11.10.2011
comment
То же самое без $(document).ready(function(){ - работает (см. 123456). То есть это означает, что код выполняется только в том случае, если прототип.js еще не загружен. - person Vladislav; 11.10.2011

arrow_upward
0
arrow_downward

Насколько я вижу, это должно сработать. Единственное, что может пойти не так, это то, что redactor.js нуждается в присваивании $ где-то в своем коде (что было бы ошибкой), но, похоже, он обрабатывает это правильно.

Вы можете проверить это, сначала загрузив прототип, затем jquery + redactor.js, а затем используя jQuery.noConflict() (который возвращает $-оператор к предыдущему значению, прототипу в этом примере).

Кстати, я бы ожидал какой-то ошибки в консоли, если второе предупреждение не появится, это тоже будет актуальная информация.

И на ваш второй вопрос: Да, оба метода должны работать нормально. Но вам нужен только 1, конечно :).

person Johan    schedule 09.10.2011
comment
Да, консоль: TypeError: 'undefined' не является функцией (оценка 'this.opts.css[key].substr(0,1)') Здесь (redactor.js): for (ключ в this.opts.css) { if (this.opts.css[key].substr(0,1) != '/') this.cssUrl[key] = this.opts.pathCss + this.opts.css[key]; иначе this.cssUrl[ключ] = this.opts.css[ключ]; } - person Vladislav; 10.10.2011
comment
Спасибо! Что я могу с этим сделать? Почему мне нужен только 1 метод? - person Vladislav; 10.10.2011
comment
Вам нужен только 1, потому что оба они делают одно и то же, это не значит, что вы можете использовать jQuery только в одном и только прототип в другом. А если проблема в redactor.js, отлаживать будет сложно. Возможно, вам следует пометить это как ошибку для redactor.js. - person Johan; 10.10.2011