Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [jQuery/JS/OOP] Dziedziczenie - problem i pytanie
starach
post
Post #1





Grupa: Zarejestrowani
Postów: 999
Pomógł: 30
Dołączył: 14.01.2007
Skąd: wiesz ?

Ostrzeżenie: (0%)
-----


Chcąc stworzyć sobie Log wywołań AJAXa postanowiłem rozszerzyć klasę Pane:
Kod
function Pane()
{
    this.id = 0;
    this.id_html = '';
    this.name = '';
    this.jquery = '';
    this.content = '';
    this.template = '';
    this.container = $('body');
    this.isMinimized = false;
    var ths = this;
    this.open = function()
    {
        this.register();
        this.setTemplate();
        this.container.append(this.template);
        this.jquery = $('div#'+this.id_html);
        this.registerEvents();
    }
    this.close = function()
    {
        this.jquery.remove();
        PaneManager.unregister(this.id);
    }
    this.minimize = function()
    {
        $('div.content', this.jquery).css('display', 'none');
        this.isMinimized = true;
    }
    this.maximize = function()
    {
        $('div.content', this.jquery).css('display', 'block');
        this.isMinimized = false;
    }
    this.register = function()
    {
        this.id = PaneManager.register(this);
    }
    this.registerEvents = function()
    {
        $('div.btn_c', this.jquery).click(function(){ ths.close() });
        $('div.btn_m', this.jquery).click(function(){ if(ths.isMinimized) { ths.maximize(); } else { ths.minimize(); } });
        this.jquery.bind('dragstart',function(event)
        {
            return $(event.target).is('.header');
    });
    this.jquery.bind('drag', function(event)
        {
            $(this).css({ top: event.offsetY,left: event.offsetX });
        });
    }
    this.setTemplate = function()
    {
        this.id_html = 'pane-' + this.id;
        this.template = '<div id="' + this.id_html + '" class="pane">\n\
                                         <div class="header">' + this.name + '\n\
                                             <div class="btn_m">-</div>\n\
                                             <div class="btn_c">x</div>\n\
                                         </div>\n\
                                         <div class="content">' + this.content + '</div>\n\
                                         </div>';
    }
}

Klasą PaneLog:
Kod
function PaneLog()
{
    this.content = '<ul></ul>';

    this.append = function($message)
    {
        $('ul', this.jquery).append('<li>'+$message+'</li>');
    }
    this.setName = function($name)
    {
        this.name = '[LOG] ' + $name;
    }
    this.close = function()
    {
        alert('test')
        this.jquery.remove();
        PaneManager.unregister(this.id);
    }
    this.test = function()
    {
        console.log(this);
        console.log(this.id_html);
    }
}
PaneLog.prototype = new Pane();


Problem pierwszy: Metoda close klasy PaneLog jest nadpisywana przez metodę klasę rodzica. Jak temu zaradzić?
Problem drugi: Przy wywołaniu metody close zgłaszany jest błąd "this.jquery.remove is not a function". Przy wywołaniu innych metod korzystających z tej zmiennej komunikat się nie pokazuje. Może to być jednak uwarunkowane tym że this.jquery jest potrzebne jedynie jako kontener w którym wyszukany ma zostać pewien element i jako że jest on pusty wyszukanie odbywa się na całym dokumencie. Jest to tylko moje przypuszczenie bo nie wiem jak mogę to sprawdzić.
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 22.08.2025 - 01:46