Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Собственный модуль на jQuery (https://javascript.ru/forum/jquery/6508-sobstvennyjj-modul-na-jquery.html)

bobroff 01.12.2009 21:15

Собственный модуль на jQuery
 
Здравствуйте.

Вопрос, наверное глупый, но как писать собственный модуль на jQuery? Взял за основу вот этот пример: http://www.rsdn.ru/article/inet/jQuery.xml

Пишу в .php файле:
...
<script type="text/javascript" src="ingredientsStorage.js"></script>
...

<script type="text/javascript" charset="utf-8">
 $("#ingredients input").click(function(){
    	$("#ingredients input").check('on');
    });
</script>


Сам ingredientsStorage.js (в точности, как в примере из ссылки выше)
jQuery.fn.check = function(mode) {
   // если mode не определен, используем 'on' по умолчанию
   var mode = mode || 'on';
   
   // В функцию неявно передана коллекция выбранных элементов.
   // Поэтому с этой коллекцией можно работать, как с любой другой
   // коллекцией элементов в jQuery
   // В нашем случае мы воспользуемся методом each()
   return this.each(function() 
   {
     switch(mode) {
       case 'on':
         this.checked = true;
         break;
       case 'off':
         this.checked = false;
         break;
       case 'toggle':
         this.checked = !this.checked;
         break;
     }
   });
 };


В результате FireBug пишет:
$("#ingredients input").check is not a function
[Break on this error] $("#ingredients input").check('on');\r


P.S.: сайт пишу на Zend Frameword, но это не должно никак влиять на расширение jQuery своим модулем.

e1f 02.12.2009 10:08

Цитата:

В функцию неявно передана коллекция выбранных элементов
Неявно? Хм, this содержит на нее ссылку, куда уж явнее ;)

А киньте-ка минимальную страничку, на которой не работает. Я просто скопипастил содержимое ingredientsStorage.js в консоль, и плагин работает.

UPD Вот рабочий пример. Отличие в присутствии .ready, иначе не будет бинда. Но ошибка в консоль все равно не должна падать.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>Без имени</title>

	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta name="generator" content="Geany 0.18" />

    <script type="text/javascript" src="jquery-1.3.2.js"></script>
    <script type="text/javascript"><!--
        jQuery.fn.check = function(mode) {
           // если mode не определен, используем 'on' по умолчанию
           var mode = mode || 'on';
         
           // В функцию неявно передана коллекция выбранных элементов.
           // Поэтому с этой коллекцией можно работать, как с любой другой
           // коллекцией элементов в jQuery
           // В нашем случае мы воспользуемся методом each()
           return this.each(function() 
           {
             switch(mode) {
               case 'on':
                 this.checked = true;
                 break;
               case 'off':
                 this.checked = false;
                 break;
               case 'toggle':
                 this.checked = !this.checked;
                 break;
             }
           });
         };
    //--></script>
    <script type="text/javascript"><!--
    $(function(){
        $(':checkbox').click(function(e){
            $(':checkbox').check('on');
        });
    });
    //--></script>
</head>

<body>
<p><input type="checkbox" /><input type="checkbox" /><input type="checkbox" /></p>
</body>

</html>

bobroff 02.12.2009 14:02

Это кажется бредом, но код заработал после перезагрузки компьютера. Может это как-то связано с кэшем, денвером и т.п.?

e1f 02.12.2009 14:20

Даже не знаю, что ответить :)
Да, по поводу плагина: попробуйте сделать
$(':checkbox').click(function(e){
    $(':checkbox').check('toggle');
});

И сразу видно неприятный баг: чекбокс, на который кликнули, ведет себя неправильно.

bobroff 02.12.2009 16:09

Уже и не знаю на что грешит, думаю скоро сойду ума. Если мой код запихнут в отдельный html файл - все работает. Когда вношу его же в на страницу сайта, который строю на Zend Framework - не работает. Как найти причину...

e1f 02.12.2009 16:15

Скиньте ссылку на проблемную страницу.

bobroff 02.12.2009 16:35

Все, надеюсь нашел окончательную причину проблемы. У Zend Framework есть такой плагин Zend Debug, который облегчает разработку сайта. Когда его отключил, все заработало!!! Все силы из меня высосала эта хрень. Теперь вопрос, как работать без таких ошибок при включенном Zend Debug.

Ссылку к сожалению скинуть не могу, т.к. работаю локально, а все сайт скидывать не имеет смысла. Проблемный код вот:
<script type="text/javascript" charset="utf-8">
                if (typeof jQuery == "undefined") {
                    var scriptObj = document.createElement("script");
                    scriptObj.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js";
                    scriptObj.type = "text/javascript";
                    var head=document.getElementsByTagName("head")[0];
                    head.insertBefore(scriptObj,head.firstChild);
                }

                var ZFDebugLoad = window.onload;
                window.onload = function(){
                    if (ZFDebugLoad) {
                        ZFDebugLoad();
                    }
                    jQuery.noConflict();
                    ZFDebugCollapsed();
                };

                function ZFDebugCollapsed() {
                    if (1 == 1) {
                        ZFDebugPanel();
                        jQuery("#ZFDebug_toggler").html("&#187;");
                        return jQuery("#ZFDebug_debug").css("left", "-"+parseInt(jQuery("#ZFDebug_debug").outerWidth()-jQuery("#ZFDebug_toggler").outerWidth()+1)+"px");
                    }
                }

                function ZFDebugPanel(name) {
                    jQuery(".ZFDebug_panel").each(function(i){
                        if(jQuery(this).css("display") == "block") {
                            jQuery(this).slideUp();
                        } else {
                            if (jQuery(this).attr("id") == name)
                                jQuery(this).slideDown();
                            else
                                jQuery(this).slideUp();
                        }
                    });
                }

                function ZFDebugSlideBar() {
                    if (jQuery("#ZFDebug_debug").position().left > 0) {
                        document.cookie = "ZFDebugCollapsed=1;expires=;path=/";
                        ZFDebugPanel();
                        jQuery("#ZFDebug_toggler").html("&#187;");
                        return jQuery("#ZFDebug_debug").animate({left:"-"+parseInt(jQuery("#ZFDebug_debug").outerWidth()-jQuery("#ZFDebug_toggler").outerWidth()+1)+"px"}, "normal", "swing");
                    } else {
                        document.cookie = "ZFDebugCollapsed=0;expires=;path=/";
                        jQuery("#ZFDebug_toggler").html("&#171;");
                        return jQuery("#ZFDebug_debug").animate({left:"5px"}, "normal", "swing");
                    }
                }

                function ZFDebugToggleElement(name, whenHidden, whenVisible){
                    if(jQuery(name).css("display")=="none"){
                        jQuery(whenVisible).show();
                        jQuery(whenHidden).hide();
                    } else {
                        jQuery(whenVisible).hide();
                        jQuery(whenHidden).show();
                    }
                    jQuery(name).slideToggle();
                }
            </script>

e1f 02.12.2009 16:47

Ну, по набору этих функций я тоже вряд ли что-то скажу. Сделайте тестовую самодостаточную страницу, которая демонстрирует проблему -- потихоньку вырубайте со страницы все ненужное, следя, чтобы репродьюсился баг. Глядишь, и станет видно, что к чему.

bobroff 02.12.2009 16:51

Методом исключения выяснил что проблема вот в этих строках кода
var ZFDebugLoad = window.onload;
                window.onload = function(){
                    if (ZFDebugLoad) {
                        ZFDebugLoad();
                    }
                    jQuery.noConflict();
                    ZFDebugCollapsed();
                };


Похоже проблема в $(). Надо писать jQuery(). Я прав?

bobroff 02.12.2009 17:08

Закоментировал
//jQuery.noConflict();
и все заработало


Часовой пояс GMT +3, время: 15:20.