Обработка событий на динамически созданных объектах
Приветствую.
Использую jquery, $(document).ready(function() нормально работает, но только с объектами, которые были на странице с "самого начала". А как обработать тот же click, не прописывая его непосредственно в атрибутах. Если вызывать $(document).ready(function() еще раз, то для существующих объектов события будут удваиваться. |
тоже ищу ответ
Да ребята делаю корпоративный сайт а на динамически созданных
объектах click не работает помогайте все !!! Плиз срочно !!! |
выкинь jquery в мусорку и пиши руками то что тебе надо...
|
да хороший ответ а посерьезней что нибудь
|
посерьёзнее: когда тебе придётся всё это переделать на prototype или другой фрейворк, ты поймёшь, что я был прав...
|
ну ладно пойду попробую на prototype
ну короче ответа ты не знаешь !!! |
Вот краткий список минусов...
Библиотеки: - лишний код библиотеки - привязка к определённой библиотеке (переделывать потом под другую запаришься: надо будет изучать другую и эту библиотеку) - привязка к длинным названиям нестандартных функций библиотеки (хрен сожмёшь нормально код) - изучение особенностей данной библиотеки - неявные неизвестные баги чужого кода Сделать самому: - время |
меня буквально позавчера попросили переделать скрипт маскированного ввода в инпуты с jquery на prototype.
В итоге я просто написал с нуля свой скрипт. Он в несжатом виде меньше по размеру, чем сжаты для jquery. Он написан как самотоятельный метод и независим ни от каких библиотек... |
ну круто молодец но я не javascript программер
мне просто сказали делай и все так знаю php, c++, delphi, perl-немного, и тут пришлось делать на javascript все самому через getElement так запорно а так готовая библия да и как я сам click обработаю по нажатию на <a> хер знает надо думать |
ZoNT,
Зачем давать такие советы в разделе jQuery? Использовать и не использовать библиотеки - выбор самостоятельный. Тем более, что приведённые тобой минусы чисто символические. Для быстрого решения простых задач, для человека, не близко знакомого с JavaScript - фреймворки подходящий вариант. BlackAngels, Я не понял твою задачу. Выложи листинг кода проблемного места. Я уверен, что задача решаема, просто ты, видимо, что-то делаешь неправильно. Какая связь, между $(document).ready() и динамически создаваемыми элементами? |
elem.onclick = function(){alert('yo-moyo')}
|
Цитата:
|
Вот то что добавляется в конец таблицы то есть строка !!!
$("#div_add a").click(
function()
{
var v=$(this).parent().parent().parent().find("table").attr("id");
var add=$('<tr id="tr"><td width="3%">1.</td><td class="ch"><a>Выберите товар ...</a></td><td class="razm"></td><td><input name="kol_list" type="text"></td><td><input name="list" value="0"> руб.</td><td class="summ">0 руб.</td></tr>');
add.appendTo("#"+v);
});
А вот обработчик click
$(".ch a").click(
function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this); val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
});
То есть по нажатия на $(".ch a") плавно появляется список |
BlackAngels,
И в чем проблема? Устанавливайте обработчик $(".ch a").click() после того, как добавили строку в конец таблицы (т.е. внутри $("#div_add a").click()), или я что-то неправильно понял? |
Да спасибо все работает !!!
Вопрос другой зачем ей еще раз подсовывать обработчик
$(".ch a").click(
function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this); val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
});
если он у иеня уже есть в начале скрипта тупость какая то или он не понимает или не видит фигня короче ????? |
Тогда просьба как сделать такую фичу по нажатии на этот
$(.ch a) значит с зади все затемняется и видно только всплывающий div и как еще организовать прокрутку этого diva со скролом ну то есть страница на месте а div сползает |
BlackAngels,
Цитата:
Цитата:
Цитата:
.класс_элемента {
width: ширина;
height: высота;
overflow-x: hidden; // Прокрутки по ширине не будет
overflow-y: scroll; // Прокрутка по высоте будет
}
|
Ну хоть на этом огромное спасибо !!!
|
Ребята в продолжение банкета все то ра
ботает только вот как только снова обрабатываешь
$(".ch a").click(
function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this); val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
});
то другой $(".ch a").click обрабатывается уже два раза и получается что div #Pr появляется как бы мелькая то есть столько раз сколько было добавлено $(".ch a").click вообще хрень как сделать чтобы он появлялся только один раз |
BlackAngels,
Что-то я не понял, что значит "еще раз обрабатываешь"? Один обработчик должен быть установлен один раз. Можно чуть более развернуто, например выложите весь листинг, где вы устанавливаете события и кусок HTML. |
$(document).ready(function()
{
$(".ch .a").click(
function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this);
val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
});
$(".div_add a").click(
function()
{
var addzak=$(this).parent().parent().parent().parent().find("table").attr("id");
if(addzak=="tab1"){
var numb=$("#tab1 tr").length;
var str='<tr id="tr"><td>'+numb+'.</td>'
str+='<td width="4%" class="close" onclick="clos(this);"><img src="close.gif" width="14" height="14"></td>';
str+='<td class="ch" style="text-align:left;"><a>Выберите товар ...</a></td>';
str+='<td><input type="text" name="shl"></td>';
str+='<td><input type="text" name="dll"></td>';
str+='<td><input type="text" name="kol"></td>';
str+='<td><input name="metr" value="0"> руб.</td>';
str+='<td><span class="summ">0 руб.</span></td></tr>';
var add=$(str);
add.appendTo("#"+addzak);
//Как вы и сказали добавить еще раз обработчик чтобы у элемента заработал click
$(".ch .a").click(
function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this);
val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
});
});
});
|
Есть очень хороший плагин listen.
Как раз для этих целей. |
А без этого незя еще 20 кб лишние
|
не 20, а 2.5кб запакованный.
Можно то и без него, но это будет универсально, и гораздо облегчает работу, тем более я не думаю, такая ситуация возникнет один раз. Это одно средство на многие случаи жизни. И не нужно будет изобретать велосипед, сомневаюсь что можно будет написать лучше. Зачем лишние грабли?? |
BlackAngels,
А, я понял проблему. У вас по клику добавляется обработчик на все элементы еще раз. Что-то я зашел в тупик. :) Первый $(".ch .a").click можно удалить - по нему этому селектору элементов все-равно на тот момент не будет. Кстати, почему ".a", если у вас просто тег? Разве не .ch a? |
BlackAngels,
В общем вы можете выкрутиться вот так:
$(document).ready(function()
{
$(".div_add a").click(
function()
{
var addzak=$(this).parent().parent().parent().parent().find("table").attr("id");
if(addzak=="tab1"){
var numb=$("#tab1 tr").length;
var str='<tr id="tr"><td>'+numb+'.</td>'
str+='<td width="4%" class="close" onclick="clos(this);"><img src="close.gif" width="14" height="14"></td>';
str+='<td class="ch" style="text-align:left;"><a>Выберите товар ...</a></td>';
str+='<td><input type="text" name="shl"></td>';
str+='<td><input type="text" name="dll"></td>';
str+='<td><input type="text" name="kol"></td>';
str+='<td><input name="metr" value="0"> руб.</td>';
str+='<td><span class="summ">0 руб.</span></td></tr>';
var add=$(str);
add.appendTo("#"+addzak);
$(".ch a").each(function() {
this.onclick = function()
{
$("#Pr").animate({opacity: 'show'}, "slow", "easein");
index = $(".ch a").index(this);
val_zak=$(this).parent().parent().parent().parent().find("table").attr("id");
}
});
});
});
|
Есть такая библиотека livequery. Используется как раз для установки на динамически созданные элементы обработчиков.
|
Цитата:
но прикрутить не смог, к моему примему так как пока это слишком сложно для новечка (((( |
Цитата:
|
| Часовой пояс GMT +3, время: 01:20. |