VPF::Обьекты и AJAX - Форум программистов

Logo

Дата 17.6.2009, 11:33 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 694
Регистрация: 22.7.2008

Репутация: нет
Всего: 10

1) В объекте есть метод load() который загружает определенной количество элементов посредством JQuery.get Проблема в том что callback функция не знает из какого объекта ее вызвали, и не знает куда вставлять элементы. Есть ли способ передать callback функции данные обьекта, или еще, лучше синхронно загрузить контент, не вызывая callback функцию, типа PHP-шного file_get_contents.

2) В конструкторе класса определенным HTML элементам надо назначить на onclick событие, вызывающее метод созданного объекта. Как это сделать? Назначаю this.metod, а он при вызове опять не видит объект.

Aliance

Дата 17.6.2009, 12:39 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Модератор: Пожалуйста, один топик - один вопрос.

Поясните подробнее суть вопроса с примерами кода.

1) RTFM
Внутри callback функции this ссылается на DOM элемент, в который вставляются данные.

2) Используй функции call или apply

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Logo

Дата 17.6.2009, 13:36 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 694
Регистрация: 22.7.2008

Репутация: нет
Всего: 10

Цитата

1) RTFM
Внутри callback функции this ссылается на DOM элемент, в который вставляются данные.

А мне надо сослаться на объект, из класса которого вызывается функция. Потому что JQurey.load заменяет контент в блоке, а мне надо к уже имеющимся в блоке блокам добавить загруженный блок.

Код

Код


// в $(document).ready(function()
a = new scrollwindow($('#top100_girl'), 6)

//класс
function scrollwindow(domscroll, allitem) { //class
    scrollwindow.prototype.line=$(domscroll).find('.line')    
    this.arrow_prev=$(domscroll).find('.arrow_left')
    this.arrow_next=$(domscroll).find('.arrow_right')    
    this.offset=0
    this.nowitem=3
    this.nitem=3
    this.item_width=129+26
    this.item_shag =31
    this.ait=allitem    
    
    scrollwindow.prototype.next = function() {    
        alert(this.nowitem) //по клику ожидаю увидеть 3, но this тут почему-то обекту не сооветствует, выводит undefined см. 3-ю снизу строчку
        firstload=0        
        if (this.nowitem<allitem) {
            if (this.nowitem>=this.nitem) {
                firstload = this.nowitem-this.nitem+1
                scrollwindow.prototype.load(firstload)
            }        
            scrollwindow.prototype.move(1)                
            if(this.nowitem+PRELOAD>this.nitem)    {            
                scrollwindow.prototype.load(this.nowitem+PRELOAD-this.nitem-firstload)
            }
            if(this.nowitem==allitem) {
                $(this.arrow_next).addClass('arrow_right_disable')    
            } else if (this.nowitem==4) {
                $(this.arrow_prev).removeClass('arrow_left_disable')    
            }
        }
    }
    scrollwindow.prototype.prev = function() {
        if(this.nowitem>3) {
            this.move(-1)    
        }
        if(this.nowitem==3) {
                $(this.arrow_prev).addClass('arrow_left_disable')    
        } else if (this.nowitem==allitem-1) {
                $(this.arrow_next).removeClass('arrow_right_disable')    
        }        
    }    
    
    scrollwindow.prototype.load = function(nload) {        
        if(typeof(nload)=='undefined') {nload=PRELOAD}        
        i=this.nitem
        nload+=i
        for(i++; i<=nload && i <= allitem; i++)
        $.get('testajax/ajax'+i+'.html', scrollwindow.prototype.apploaded, 'html')// Загрузка HTML элемента
    }
    scrollwindow.prototype.apploaded = function (html) {
            alert(this.nowitem) // Должно вывести '3', но т.к. this здесь обьекту не соответствует, выводит undefined
            $(this.line).append(html) //здесь от этого не работает    
            this.nitem++    
    }
    
    this.moveto=0
    scrollwindow.prototype.move = function(to) { // to = -1 or 1
        this.moveto=to
        scrollwindow.prototype.animation()        
        this.nowitem+=to
    }
    this.timer=0
    this.intervalref    
    scrollwindow.prototype.animation = function() {
        
        if(this.timer==0) {
            this.intervalref=setInterval(scrollwindow.prototype.animation, 5)
            this.timer= this.item_width / this.item_shag
        } else {
            this.offset+= (this.item_shag)* -this.moveto;
            $(this.line).css('margin-left', this.offset + 'px')        
            this.timer--
        }    
        if(this.timer==0) {
            clearInterval(this.intervalref)    
        }
        
    }

    $(this.arrow_prev).mousedown(scrollwindow.prototype.prev)
    $(this.arrow_next).mousedown(this.next)     //здесь на стрелку пытаюсь навесить метод next()
    this.load()    
}

Добавлено @ 13:44
HTML, для которого код

Код


<div class="scroll scroll_right" id="top100_boy">
             <div class="arrow_left arrow_left_disable"></div><div class="arrow_right"></div> <!-- стрелки -->
             <div class="frame"> <!-- у этого overflow:hidden -->
                    <div class="line"> <!-- длинная полоса, которая должна ездить, показывая разных пользователей в блоке frame-->
                        <div class="item">
                            <a href="" class="image"><img src="sample_user1.jpg" alt="фото"></a>
                            <div class="desc">
                                <a href="#">Анастасия</a>
                                <div>Москва</div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="" class="image"><img src="sample_user2.jpg" alt="фото"></a>
                            <div class="desc">
                                <a href="#">Анастасия</a>
                                <div>Москва</div>
                            </div>
                        </div>
                       <div class="item">
                            <a href="" class="image"><img src="sample_user3.jpg" alt="фото"></a>
                            <div class="desc">
                                <a href="#">Анастасия</a>
                                <div>Москва</div>
                            </div>
                        </div>
                    </div>  
                </div>          
            </div>

Это сообщение отредактировал(а) Logo - 17.6.2009, 14:41

Aliance

Дата 17.6.2009, 14:52 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Что-то я до конца не соображу, попробуй так:

Код


$( this.arrow_next ).mousedown( function() { return this.next; } )

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

Logo

Дата 17.6.2009, 15:19 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 694
Регистрация: 22.7.2008

Репутация: нет
Всего: 10

Так вообще .next не вызывается. Опера пишет Statement on line 103: Type mismatch (usually non-object value supplied where object required), FireFox молчит, но ничего не делает.

Это сообщение отредактировал(а) Logo - 17.6.2009, 15:23

Logo

Дата 18.6.2009, 11:06 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 694
Регистрация: 22.7.2008

Репутация: нет
Всего: 10

Первый вопрос решил, помогло http://javascript.ru/php/file_get_contents

Со вторым вот простенкий пример, иллюстрирующий проблему

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Пример</title>
<style type="text/css">
#button {background:#f00; color:#fff; font-weight:bold; padding:3px 5px; cursor:pointer; float:left}
</style>
<script type="text/javascript">
window.onload= function() {
    obj= new myclass(document.getElementById('button'))
}
function myclass(objref) {
    this.message="Я обект, тарм-пам пам"
    this.obj=objref
    myclass.prototype.helloworld = function() {
        alert(this.message) //Должен при клике на кнопку сказать 'Я обект, тарм-пам пам', а сообщает undefined
    }
    
    this.obj.onclick=this.helloworld;
    //this.obj.onclick=this.helloworld.call(this); 
    //this.obj.onclick=function() {this.helloworld()}; 
    //this.obj.onclick=myclass.prototype.helloworld.call(this); //- это все тоже не работает
}
</script>
</head>
<body>
<div id="button">нажмии меня</div>
</body>
</html>

Logo

Дата 19.6.2009, 15:40 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 694
Регистрация: 22.7.2008

Репутация: нет
Всего: 10

Вопрос решен

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »