DomenForum.net

DomenForum.net (https://domenforum.net/index.php)
-   Программирование (https://domenforum.net/forumdisplay.php?f=26)
-   -   JS не стыкуется с AJAX: HELP (https://domenforum.net/showthread.php?t=215313)

Port_Artur 26.02.2018 22:44

JS не стыкуется с AJAX: HELP
 
На странице есть кнопка, при клике на которое всплывает модальное окно на Fancybox. JS в этом отрабатывает нормально.

Но, когда точно такую же кнопку (код точная копиия) подгружаешь через AJAX, то сколько на неё не кликай, - окно не всплывает.

Такое ощущение, что JS не видит что я кликаю на кнопку

ПОЧЕМУ?

JS и AJAX действительно не стыкуются?

cmsdev 27.02.2018 00:09

код покажите

добавлено через 2 минуты
например в jQuery есть click который с аякс не дружит, а есть
.live( "click", function() {
или
.on( "click", function() {
который работает с новыми элементами, которые выводит аякс

Port_Artur 27.02.2018 00:59

Сюда:

PHP код:

<div id="wrappers\" class=\"s-wrapper\">"

подгружается через AJAX:

PHP код:

<div id="wrapper" class="time-s">

                  <
div id="tst" max="20" class="s-title">Текст</div>

                  <
div class="s-week">
<
div id="y_1" class="show">
<
div class="e-day">26.02<br>Сегодня</div>
<
div class="time-one"><class="modalbox buttontime" href="#inline" rel="nofollow" >Тест</a></div>

... 

вот такой код JS не обрабатывает клик по ссылке в примере вверху:

Код HTML:

$("#wrappers").on("click", ".modalbox", function(){

....

Я привёл уже пример с делегированной обработкой событий
Вроде должно работать, но нет. Возможно ошибка.

Miqip 27.02.2018 01:01

Port_Artur, если коротко: у Fancybox, как и у многих плагинов, есть функция инициализации, она запускается в момент загрузки страницы и вешает на существующие элементы свои события-свойства-мишуру-гирлянды.
Если через какое-то время на странице появляется новый элемент, ему эту ерунду уже никто не вешает, а значит надо просить плагин провести инициализацию повторно.

Если более подробно — надо смотреть конкретный код подключения плагина, его версию, его руководство.

Miqip 27.02.2018 01:01

Port_Artur, если коротко: у Fancybox, как и у многих плагинов, есть функция инициализации, она запускается в момент загрузки страницы и вешает на существующие элементы свои события-свойства-мишуру-гирлянды.
Если через какое-то время на странице появляется новый элемент, ему эту ерунду уже никто не вешает, а значит надо просить плагин провести инициализацию повторно.

Если более подробно — надо смотреть конкретный код подключения плагина, его версию, его руководство.

Port_Artur 27.02.2018 01:02

Вот так если быть точным:

Код HTML:

$(document).ready(function( {scrolling: VISIBLE,}) {

                $(".modalbox").fancybox() ;
                $("#contact").submit(function() { return false; });

$("#wrappers").live("click", ".modalbox", function(){

добавлено через 1 минуту
Фенсибокс V3.0.47 2017 года

добавлено через 3 минуты
Я так понимаю судя с ваших слов, нужно как заново повесить:

PHP код:

$(".modalbox").fancybox() ; 

Как это сделать?

добавлено через 20 минут
Повторно повесил Фенсибокс $(".modalbox").fancybox() ; в ON
Не знаю правильно ли, но так заработало:

PHP код:

$(document).ready(function( {scrollingVISIBLE,}) {

        $(
".modalbox").fancybox() ;
        $(
"#contact").submit(function() { return false; });

$(
"#wrappers").on("click"".modalbox", function(){

$(
".modalbox").fancybox() ; 

добавлено через 36 минут
Ещё 1 ПРОБЛЕМА!!!

В ссылке передаётся параметр id-text:
Код HTML:

<a class="modalbox buttontime" href="#inline" id-text="сообщение" rel="nofollow" >
И раньше код записывал его значение

Код HTML:

$("input#id-text").val($(this).attr("id-text"));
в Value (изначально значение =1):

Код HTML:

<input type="hidden" id="id-text" name="id-text" value="1">
А сейчас перестал записывать
В исходном коде открытого окна строка выглядит

Код HTML:

<input type="hidden" id="id-text" name="id-text" value="">
Что сделать чтобы записывал?

добавлено через 8 часов 47 минут
Вместо

Код HTML:

$("#wrappers").live("click", ".modalbox", function(){
нужно использовать

Код HTML:

$("#wrappers").on("click", ".modalbox", function(){

Не знаю в чём именно разница, но так работает и видит передаваемые через ссылку переменные.

Всем спасибо за помощь

Вопрос закрыт

pegs 27.02.2018 09:55

Цитата:

Сообщение от Port_Artur (Сообщение 1452578)
Как это сделать?

Загрузили АJAX-ом новый элемент - привязываете заново.

Цитата:

Сообщение от Port_Artur (Сообщение 1452578)
Что сделать чтобы записывал?

Вы какие-то куски оторванные выкладываете, по ним ничего не понять. В частности, не понятно где вызывается "$("input#id-text").val($(this).attr("id-text"));". Работает ли с незагруженных AJAX-ом элементов или нет.

Port_Artur 27.02.2018 10:13

Цитата:

Сообщение от pegs (Сообщение 1452601)
В частности, не понятно где вызывается "$("input#id-text").val($(this).attr("id-text"));".

Это код в HEAD, загружается вместе со страницей.

Уже всё получилось. Я просто не знал что на загружаемые элементы нужно заново всё вешать.

pegs 27.02.2018 10:34

Ещё одна из особенностей JS - "специфическая" видимость/привязка переменных ;) Вот тут иногда мозг может закипеть :)

Port_Artur 27.02.2018 10:35

Примерно так вчера и было, пока не помогли разобраться.
Сам то я JS не знаю, только благодаря примерам из Интернета и помощи знатоков что-то получается делать.


Текущее время: 01:18. Часовой пояс GMT +4.

Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Техническая поддержка — DevArt.PRO. Перевод: zCarot.