мой первый плагин jquery: нужны советы, как сделать это лучше + проблема с тайм-аутом - PullRequest
Новая
       11

мой первый плагин jquery: нужны советы, как сделать это лучше + проблема с тайм-аутом

0 голосов
/ 26 сентября 2011

Я создаю свой первый плагин jquery и хотел бы несколько советов, чтобы сделать это лучше.У меня также есть ошибка в моем коде, от которой я хотел бы избавиться.Я пытаюсь обновить содержимое моего виджета через setTimeout в моем обратном вызове ajax success.это работает (без аргументов), но мне нравится передавать аргумент примерно так: 

setTimeout(refresh(o.refresh), 5000);

Я не уверен, что это так, но я следовал своей интуиции.У меня есть следующая ошибка в firebug

бесполезный вызов setTimeout (пропущены кавычки вокруг аргумента?)

Я не понимаю эту ошибку, потому что аргумент предоставлен функции обновленияпеременнаяМне нужно передать аргумент, чтобы увидеть, вызвано ли событие двойным щелчком пользователя (виджет переключается в открытый режим) или методом setTimeout (виджет открыт, поэтому его не нужно закрывать).Я не уверен, что то, что я пытаюсь сделать, даже возможно.Я мог бы решить мою проблему, добавив условный вызов ajax для опции обновления, но я не хочу дублировать код.надеюсь, кто-нибудь может дать мне несколько советов и подсказок, не только за мою ошибку, но и в целом (разработка плагинов).как начинающий jquery, я не уверен, что мой код является обычным.

мир 

        /**
 * @author kasperfish
 */
(function($){
    $.fn.extend({

    widgetIt: function(options) {

        var defaults = {
            title: 'Widget Title',
            load:'',
            top: '50px',
            left: '400px',
            width: '500px',
            afterLoad: function(){},
            reload:false,
            refresh:true
        };

        var options = $.extend(defaults, options);
        var o=options;

        return this.each(function() { 

              var container=$(this).css({'z-index':3, display:'inline-block',position:'absolute',top:o.top,left:o.left,'max-width':o.width})
                            .addClass('widget_container');
              var header = $('<div></div>')
                            .addClass('ui-widget-header widgethead')
                            .css({'min-width':'130px'});

              var title =$('<div></div>').addClass("w_tit").html(o.title);
              var content =$('<div></div>')
                           .addClass("w_content")
                           .hide();


              //append
              $(title).appendTo(header) ;
              $(header).appendTo(container) ;
              $(content).appendTo(container) ;

              //make draggable
              $(container).draggable({
                cancel: 'input,option, select,textarea,.w_content',
                opacity: 0.45,
                cursor: 'move'
                });

              //binding
                var display=$(content).css('display'); //check if widget is open=block or closed=none
                var reload=true ; //set initially to true->reload content every time widget opened
                var refreshcontent=false;
              $(header).dblclick(function refresh(refreshcontent){

                if(!refreshcontent)//if it's not a refresh
                $(content).fadeToggle();//open or close widget
                //[show ajax spinner]

                    if(display="block" && reload){//only load on widget open event

                      $.ajax({
                        url: o.load,
                        context: content,
                        success: function(data){
                        $(content).html(data);
                        reload=false;
                        //[hide ajax spinner]
                        setTimeout(refresh(o.refresh), 5000);//refresh every 5s
                        o.afterLoad.call();},
                        error: function(){
                        // error code here
                        }
                        }); 
                    }else if(display="none"){reload=o.reload;}//set reload true or false
              });


             $(header).click(function (){
                $(container).topZIndex('.widget_container');

             });
             //close all open widgets and animate back to original position
             $('#deco').click(function (){
                        $(content).hide();
                        $(container).animate({ "left": o.left, "top": o.top}, "slow");

             });  
        });
    }
});
})(jQuery);

1 Ответ

5 голосов
/ 26 сентября 2011

Вы передаете результат refresh(o.refresh) в setTimeout, поэтому он бесполезен.Вместо этого вам нужно передать функцию, которая вызывает refresh(o.refresh), когда срабатывает setTimeout: 

setTimeout(function () { refresh(o.refresh); }, 5000);

Что касается «советов» по ​​улучшению кода, я предлагаю вам задать эту часть вопроса Code Review , который больше подходит для такого типа вопросов.

...