Intereting Posts
the_content, не отображающий адаптивные атрибуты изображения srcset или размеры Форма заказа клиента Woocommerce Заказ wp_get_nav_menu_items не работает Вопрос о wp_update_post в массиве Как упорядочить термины таксономии численно, от самого низкого до самого высокого, используя get_terms Возвращает страница 409 Сравните «Основной» идентификатор сообщения с идентификатором внутри цикла wp_query Как вывести иерархический путь таксономии, только с самым глубоким сроком? Пользовательские запросы – дочерние категории не отображаются functions.php и условные теги Какие перехватчики / фильтры используются для изменения выбранных терминов при сохранении сообщения? Фильтрация подстраниц в цикле while из объекта запроса WP Как получить описание терминов в запросе архива термина таксономии? PHP-уведомления появляются при просмотре любой страницы в администраторе, но только для дочерней темы, используя код из WP Codex Изменение сервера WordPress – медленное время входа в систему администратора

Элегантно используя JavaScript в виджетах.

Я работаю над проектом с большим количеством виджетов, и я думаю, что было бы здорово иметь раздел «Дополнительные параметры», построенный с использованием JQuery UI Accordion, который расширяется при нажатии.

Итак, я установил «jquery-ui-accordion» с помощью действия «admin_enqueue_scripts»:

function add_my_deps() { wp_enqueue_script('jquery-ui-accordion'); } add_action( 'admin_enqueue_scripts', 'add_my_deps' ); 

… И мой JavaScript выглядит примерно так:

 (function($){ $('.more-options-expansible').accordion(); })(jQuery) 

Что теперь?

Если я выложу в очередь, что с помощью действия «add_my_deps» выше, оно работает только, если я перезагружаю страницу (Т.е. при размещении виджета JavaScript создается до создания элемента, а если виджет сохранен, его JavaScript ставится в очередь как обычно и он создается как обычно.).

Если я поместил это в <script> в конце моего вывода HTML в моем методе widget form() , я получаю следующее исключение: Uncaught TypeError: Object [object Object] has no method 'accordion' . Это связано с тем, что, по-видимому, он запускает аккордеон через встроенный <script> прежде чем будет загружена библиотека Accordion jQuery.

Есть ли что-то очевидное, что мне не хватает? Я использую простой экземпляр jQuery для этого примера, но похоже, что у меня были бы еще худшие проблемы, если я попытался сделать что-либо с помощью AJAX (А именно, как бы я выбрал подходящий элемент для размещения ответа? Мне нужно начать использовать Backbone.js для выполнения?).

Любая помощь?

Solutions Collecting From Web of "Элегантно используя JavaScript в виджетах."

Один из путей, который я обнаружил, начиная с размещения вышеуказанного вопроса, заключается в WP_Widget::form() экземпляра WP_Widget::form() через WP_Widget::form() , где wp_enqueue_script() загружает необходимый JavaScript (как указано выше) – кроме, и вот ключевая часть, загрузка JavaScript в заголовке вместо wp_enqueue_script() колонтитула (пятый аргумент wp_enqueue_script() ).

Теперь я думаю об этом.

Даже тем не менее, я ненавижу использовать встроенный JavaScript – когда-либо – и загрузка всего в заголовке менее идеальна.

Поэтому я оставляю этот вопрос открытым, если у кого-то есть лучшая идея.

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

Он будет терпеть неудачу, потому что, когда JS запускает его, создается экземпляр против скрытой формы виджетов в левой части. Оказывается, когда вы перетаскиваете виджет на активную боковую панель, он фактически клонирует скрытую форму в правую сторону, в отличие от аяксинга в ее содержимом. Это означает, что новый виджет, который вы добавили, уже имеет accordion созданный против него, но из-за клонирования вещи не работают так хорошо изначально. Хотя, очевидно, после обновления страницы он будет работать отлично.

Чтобы он работал по назначению, когда мы добавляем новый виджет, нам нужно настроить таргетинг на наш контент формы, который находится в правой части страницы, мы также можем подключиться к событию ajaxstop вместо загрузки. Это происходит потому, что после того, как клонированный виджет опущен в правую сторону, WordPress отправляет запрос ajax для сохранения позиции виджетов.

 $(document).on('ajaxstop', '#widget-right .more-options-expansible', function(e){ $(this).accordion(); }); 

Это приводит к более приятному решению, чем добавление встроенного JS-файла и позволяет хранить сценарии в нижнем колонтитуле.