Вопрос по js / jQuery в админке Есть решение

Question

Вопрос по js / jQuery в админке Есть решение

Форум разработчиков »

Потихоньку изучаю как работает js и jQuery. В админке подключил .js файл и попробовал в него добавить такой код:

$(document).ready(function(){
    $(&#039;#wa&#039;).addClass("test1");
    $(&#039;#s-order-title&#039;).addClass("test2");
});

Т.е. хочу добавить классы к элементам.

Эта строчка корректно работает к элементу с id 'wa':

$(&#039;#wa&#039;).addClass("test1");

А эта строчка не добавляет класс к элементу с id 's-order-title':

$(&#039;#s-order-title&#039;).addClass("test2");

Как я понял, причина в том, что элемента "#s-order-title" (заголовок страницы заказа) в исходном коде страницы нет, он добавляется иным способом (как и я вся страница заказа).

---

Вопрос: как добавить класс к этому элементу?

9 ответов

1

Алексей Webasyst 24 сентября 2020 16:47 # Решение

Часть элементов подгружается отдельными запросами, поэтому ваш скрипт вероятно срабатывает, когда загрузилась основная страница, но еще нет нужного вам блока.

ответить
- +1
  
  chikurov-seo 29 сентября 2020 10:57 #
  
  В итоге решил проблему перемещением JS кода из head-а в body через хук для страницы заказов.
  
  ответить
+1

Николай Иванов 25 сентября 2020 13:26 #

Ajax вызовов может быть много. Каждый из них будет вызывать ajaxCompete. Получается при каждом таком вызове будет исполняться ваш код, что не очень хорошо со всех точек зрения. Как вариант конечно пойдёт, но лучше посмотрите на MutationObserver.
https://developer.mozilla.org/...

ответить

+1

chikurov-seo 25 сентября 2020 13:36 #

Спасибо. Как раз искал то что искал. Почитаю.

ответить

+1

Syrnik.com 5 октября 2020 21:56 #

Можно найти хук, который выводит что-нибудь именно на карточке заказа. Скажем, backend_order и выводить ваш js, меняющий #s-order-title по этому хуку, например, в область info подсовывать ваш js-код

ответить

+1

chikurov-seo 6 октября 2020 13:43 #

Спасибо за ответ. Я как раз именно так проблему и решил, отписался об этом в ветке выше.

ответить
1

Константин Шевский 26 января 2021 17:41 # Решение

Вот обёртка над Mutation Observer - функция, которая позволяет найти элемент, который может как уже быть в DOM, так и нет - https://jsfiddle.net/dxgt39cn/

ответить

Добавить ответ

**chikurov-seo** · Answer 1

UPD. Погуглил, подредактировал код, вроде заработало:

$( document ).ajaxComplete(function() {
    $('#wa').addClass('test1');
    $('#s-order-title').addClass('test2');
});

Это правильное решение задачи? Или есть более правильный вариант?

**Марк Орлов** · Answer 2

1

Марк Орлов 11 января 2021 19:28 #

Очень даже интересно, многих вещей даже не знал.

ответить