VPF::События для только-что добавленного html-а.

Elfet

Дата 9.8.2009, 13:58 (ссылка)

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

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

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

Всем привет!
Такая проблема у меня возникла: я получаю по ajax html код который вставляю на страницу, только на этот код должны быть навешаны определённые события.
Как такое можно сделать?

Пример:

Код


$('#ins').append(' <div class="cl"> Click </div>  ');

function init() {
    $('.cl').click(function () {
              $('#ins').append(' <div class="cl"> Click </div>  ');
         });
}

$(document).ready(init);

На второй добавленный div уже никаких событий не происходит.

В jQuery это можно решить с помощью live( type, fn ) :

Код



    $('.cl').live("click", function () {
              $('#ins').append(' <div class="cl"> Click </div>  ');
         });

только мне это не подходит, так как live ещё не поддерживает этих событий: blur, focus

Как реализовать самому такое?

Заранее спасибо!

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

PHP Чат Скрипт

mxt

Дата 9.8.2009, 14:09 (ссылка)

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

Загрузка ...

Шустрый

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

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

поставь на контейнер отлов нужных событий,
а потом уже по css классам (или другими параметрами) смотри что делать с этим элементом

Это сообщение отредактировал(а) mxt - 9.8.2009, 14:10

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

Elfet

Дата 9.8.2009, 19:36 (ссылка)

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

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

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

Цитата(mxt @ 9.8.2009, 15:09

)

поставь на контейнер отлов нужных событий,

Как?

Добавлено через 1 минуту и 19 секунд
Как я прочитал в делегировании событий вообще нельзя использовать blur, focus. smile

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

PHP Чат Скрипт

diadiavova

Дата 10.8.2009, 01:15 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

Здесь одна кнопка создаёт поле, а вторая добавляет обработчики событий фокус и блар.

Код


<html>
<head>
    <title>Untitled Page</title>

    <script type="text/javascript">

        function ins_onclick()
        {
            var cont = document.getElementById("content");

            cont.innerHTML = "<input type='text' id='txt'>";
        }

        function addHdlrs_onclick()
        {
            var t = document.getElementById("txt");

            t.onfocus = txtFocus;
            t.onblur = txtBlur;
        }

        function txtFocus()
        {
            setStatus("focused");
        }

        function txtBlur()
        {
            setStatus("not focused");
        }

        function setStatus(val)
        {
            var st = document.getElementById("status");
            st.innerHTML = val;
        }

    </script>
</head>
<body>
<div id="content"></div>
    <input id="ins" type="button" value="Создать объект" onclick="return ins_onclick()" >
    <input id="addHdlrs" type="button" value="Добавить события" onclick="return addHdlrs_onclick()" >
    
    <div id="status"></div>
</body>
</html>

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

Elfet

Дата 10.8.2009, 14:55 (ссылка)

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

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

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

diadiavova, ок, спасибо. А если нужно создать несколько объектов и не по id, а по классу?

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

PHP Чат Скрипт

diadiavova

Дата 10.8.2009, 14:58 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

Просто надо перебрать все элементы и проверить имя класса в каждом, в зависимости от результата проверки назначить обработчики.

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

mxt

Дата 12.8.2009, 10:16 (ссылка)

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

Загрузка ...

Шустрый

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

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

Цитата(diadiavova @ 10.8.2009, 14:58

)

если к примеру слишком много элементов, то это не пойдет.

Цитата(Elfet @ 9.8.2009, 19:36

)

Цитата(mxt @ 9.8.2009, 15:09 )
поставь на контейнер отлов нужных событий,

Как?

просто ставишь отлов событий на контейнер, а потом через event.originalTarget || event.srcElement;
узнаешь на каком элементе произошло событие. а далее по классу можно делать то что нужно

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

diadiavova

Дата 12.8.2009, 10:25 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

Цитата(mxt @ 12.8.2009, 11:16

)

если к примеру слишком много элементов, то это не пойдет.

Это ещё почему? smile

Я ведь не написал, что надо перебирать вручную? Тут для всех элементов используется один и тот же код, поэтому если элементы в контейнере расположены линейно, то перебрать в цикле, а если нет - рекурсивно.

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

mxt

Дата 12.8.2009, 17:32 (ссылка)

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

Загрузка ...

Шустрый

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

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

тут дело не только в переборке элементов, а в самой сути добавления отлова событий для каждого элемента (если их много)

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

diadiavova

Дата 12.8.2009, 17:36 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

mxt, не понял smile

Добавлено через 1 минуту и 12 секунд
smile

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

mxt

Дата 12.8.2009, 18:28 (ссылка)

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

Загрузка ...

Шустрый

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

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

Код


function testHandler(event)
{
   var target = event.originalTarget || event.srcElement;

   if (target.className == 'testClass')
   {
       ...
   }
}


var container = document.getElementById("container");

container.addEvent("click", testHandler)  // Тут может быть другой способ добавления обработчиков событий

такой подход лучше всего использовать когда нужно у очень большого количества элементов отлавливать события

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

diadiavova

Дата 12.8.2009, 18:36 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

Вообще-то я хотел увидеть пример, в котором предложенный мной метод может вызвать проблемы.

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

mxt

Дата 12.8.2009, 19:04 (ссылка)

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

Загрузка ...

Шустрый

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

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

проблема в том, что будет повешано много обработчиков событий.

Добавлено через 29 секунд
+ в моем случае, не нужно делать лишних действий после добавления элемента в контейнер.

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

diadiavova

Дата 12.8.2009, 19:10 (ссылка)

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

Загрузка ...

Доктор Зло(диагност, настоящий, с лицензией и полномочиями)

Профиль
Группа: Модератор
Сообщений: 5821
Регистрация: 14.8.2008
Где: В Коньфпольте

Репутация: 11
Всего: 142

Цитата(mxt @ 12.8.2009, 20:04

)

проблема в том, что будет повешано много обработчиков событий.

На сколько я понял задача состоит в том, чтобы обработчики были одни и те же.
Мне кажется, что мы просто друг друга не понимаем. Я думаю, что если бы ты привёл пример кода, в котором появятся описанные проблемы, мы поняли бы друг друга намного быстрее. Пока я вообще не понял о чём речь.

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

Хочешь получить мудрый совет - читай подписи участников форумов.
Злой доктор Щасзаболит smile

mxt

Дата 12.8.2009, 19:20 (ссылка)

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

Загрузка ...

Шустрый

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

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

http://webo.in/articles/habrahabr/04-speed...vents-handlers/

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

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