Как подавить переадресацию кликов привязки в кадре предварительного просмотра?

Я заметил 3 сценария, связанные с ссылками в кадре предварительного просмотра.

1) Щелчок ссылки на внешний url ничего не делает. Это хорошо.

2) Щелчок по ссылке на один и тот же URL-адрес источника / домена приводит к обновлению предварительного просмотра с помощью содержимого этого URL-адреса. Опять же, хорошо.

3) Нажав на ссылку с тегом хэширования или привязки, обновите предварительный просмотр настроек и внесите ли вы настройку домашней страницы сайта, то есть, где вы закончите, если вы не обновите браузер, чтобы вернуться к настройке страницы / сообщения вы были изначально.

Например, если вы хотите стилизовать мобильное меню, в классическом элементе «гамбургер» используется тег привязки, который запускает это нежелательное обновление. Я хочу, чтобы можно было открыть меню так же, как событие click на опубликованном интерфейсе, а затем использовать мои отличные инструменты для настройки, чтобы создать свое меню, которое позволяет мой плагин.

Другие элементы также входят в игру, такие как значки, вкладки и другие тонкие анимации щелчков на лицевой панели, которые «раскрывают» дополнительный контент на странице.

Например, это может быть код темы, который будет использовать это поведение:

<a href="#" class="show-me"> <i class="some-nifty-icon-gizmo-that-animates-into-view"></i> </a> 

Есть ли способ отключить этот прослушиваемый прослушиватель событий щелчка по каждому элементу?

Я пробовал обычные event.preventDefault и event.stopPropagation, чтобы обойти это, но пока не повезло. Я также пробовал методы jQuery «отключить» и «отвязать», но, похоже, не мог прибить его.

Похоже, что он поступает из /wp-includes/js/customize-preview.min.js, и все события щелчка тегов якоря выходят за пределы элемента body.

В настоящий момент это способ манипулировать DOM через инспектор браузера, чтобы добавить какой-либо класс или css, необходимый для первоначального события кликов.

Редактирование: Пожалуйста, речь идет не о стандартах и ​​семантике кодирования темы, примеры, приведенные выше, – это только те примеры, с которыми могут столкнуться любые плагины. Хотя я обязательно не использовал бы якорный тег для кнопки меню, мы (как разработчики программного обеспечения) все еще должны планировать эти вещи.

Обновление: исправление здесь включено в WordPress Core trunk для предстоящей версии 4.5 (теперь в альфа). См. R36371 .


Я думаю, что проблема с развязыванием обработчика событий заключается в том, что это делается слишком рано. Попробуйте сделать это в preview-ready событии Customizer. Например, запустите следующий JS в предварительном просмотре Customizer (с customize-preview в качестве зависимости от сценария), который click.preview логику click.preview если click.preview ссылка имеет целевую ссылку на странице, или если она использует протокол javascript: :

 if ( /\/customize\.php$/.test( window.location.pathname ) ) { wp.customize.bind( 'preview-ready', function() { var body = $( 'body' ); body.off( 'click.preview' ); body.on( 'click.preview', 'a[href]', function( event ) { var link = $( this ); if ( /^(#|javascript:)/.test( link.attr( 'href' ) ) ) { return; } event.preventDefault(); wp.customize.preview.send( 'scroll', 0 ); wp.customize.preview.send( 'url', link.prop( 'href' ) ); }); } ); } 

Включение типа href действительно должно быть частью Core, и я добавлю его в список todo, чтобы получить это как часть цикла 4.5.

Обратите внимание, что тест для customize.php заключается в том, чтобы убедиться, что транзакции с естественным URL-адресом , используемые в качестве предварительного просмотра URL-адреса предварительного просмотра, не были реализованы, поскольку это изменение будет означать изменения в логике click.preview .