jQuery не видит созданный элемент

12
Ragnarok
На сайте с 25.06.2010
Offline
226
10656

Есть магазин на OpenCart с его выводом товаров "таблицей" и "построчно"

Есть скрипт покупки в 1 клик. При клике по кнопке на товаре он срабатывает, допустим, хотя бы так


$(document).bind("ready ajaxComplete",function(){
$(".oneClick").click(function(){
alert("works!!");
})
});

При первой загрузке страницы клик действительно срабатывает.

Но в хитром OpenCart для переключения вида с плитки на таблицу используется примерно такой код, "пересобирающий" внешний вид каждого товара в категории


function display(view) {
if (view == 'list') {
$('.product-grid').attr('class', 'product-list');

$('.product-list > div').each(function(index, element) {
html = '<div class="right">';
html += ' <div class="cart">' + $(element).find('.cart').html() + '</div>';
//blablabla собирает html

html += '</div>';
$(element).html(html);
});
}
...

И после переключения и такой "пересборки" jQuery перестаёт видеть клик по вновь созданному <span class="oneClick">купить в 1 клик</span>

Что делать?

//TODO: перестать откладывать на потом
Seredniy
На сайте с 17.03.2008
Offline
251
#1

Вам нужно смотреть в сторону On() и вешать обработчик. В вашем случае вешать клик на .oneClick элементы. На родителя точнее. Там, где будут появляться такие элементы.

сам недавно задавался вопросом таким

Wordpress и другие CMS: правки, настройка, верстка и натяжка шаблонов, разработка сайтов "под ключ" (/ru/forum/1008050)
LEOnidUKG
На сайте с 25.11.2006
Offline
1726
#2

Нужно юзать вот это:

http://api.jquery.com/on/

Вообще если динамически работаете с JS, то вообще забудьте про просто click, всё нужно через on делать

✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/
Ragnarok
На сайте с 25.06.2010
Offline
226
#3


$(document).ready(function(){
$("div").on('click', ".oneClick", function(){
alert("works!");
});
});

делаю так -- открывается 5 алертов подряд

убираю document.ready -- вообще не срабатывает..

что я делаю не так?

Joker-jar
На сайте с 26.08.2010
Offline
154
#4

Вешайте не на "div" а на конкретный id родительского div'а.

[Удален]
#5
LEOnidUKG:
Вообще если динамически работаете с JS, то вообще забудьте про просто click, всё нужно через on делать

про on забыть, делегирование в данном случае - одевание штанов через голову :(

проще использовать jquery.livequery ;)

и получится

$('.oneClick').livequery('click',function(){});

но самое хорошее что можно сделать и вот так

$('.oneClick').livequery(function(){},function(){});

т.е. выполнить при появлении в dom элемента .oneClick

и не важно как он там появился

:)

K
На сайте с 03.06.2015
Offline
45
#6

Слушать надо .product-grid и затем разбираться через target кого именно кликнули.

---------- Добавлено 23.06.2015 в 07:24 ----------

Да, и вот эта строчка

$('.product-list > div').each(function(index, element) {

бред.

Ибо product-list сам все можете перелопатить при условии что все данные загружены.

MYSQL PHP JS HTML CSS SEO TXT США СССР
Seredniy
На сайте с 17.03.2008
Offline
251
#7

burunduk, т.е. лучше плагин повесить? Кстати, спасибо, о нем не знал.

K
На сайте с 23.06.2015
Offline
0
#8
Ragnarok:
Есть магазин на OpenCart с его выводом товаров "таблицей" и "построчно"
Есть скрипт покупки в 1 клик. При клике по кнопке на товаре он срабатывает, допустим, хотя бы так

$(document).bind("ready ajaxComplete",function(){
$(".oneClick").click(function(){
alert("works!!");
})
});

При первой загрузке страницы клик действительно срабатывает.
Но в хитром OpenCart для переключения вида с плитки на таблицу используется примерно такой код, "пересобирающий" внешний вид каждого товара в категории

function display(view) {
if (view == 'list') {
$('.product-grid').attr('class', 'product-list');

$('.product-list > div').each(function(index, element) {
html = '<div class="right">';
html += ' <div class="cart">' + $(element).find('.cart').html() + '</div>';
//blablabla собирает html

html += '</div>';
$(element).html(html);
});
}
...

И после переключения и такой "пересборки" jQuery перестаёт видеть клик по вновь созданному <span class="oneClick">купить в 1 клик</span>

Что делать?

только так, вместо click()

$(document).delegate( ".class", "click", function() {

// code
}

я с этой фигней две недели мучался. мне тоже говорили смотреть в сторону on(), ерунда это все

[Удален]
#9

Seredniy, плагин маленький, а удобств куча :)

обычно проблема в том, что подключают библиотеку и кучу плагинов, каждый для своей маленькой задачи - это неоправданно, большинство задач решается более простыми способами, если используется какая либо библиотека, то использовать её надо хотя бы процентов на 40-50 ;)

Ragnarok
На сайте с 25.06.2010
Offline
226
#10

Всем спасибо, воспользовался вариантом kowap


$(document).delegate( ".class", "click", function() {
// code
}
12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий