TinyMCE вычеркивает атрибут «controlsList» в HTML 5 Audio Tag - PullRequest
Новая
       7

TinyMCE вычеркивает атрибут «controlsList» в HTML 5 Audio Tag

0 голосов
/ 29 ноября 2018

В редакторе TinyMCE я хочу добавить действительный атрибут элемента, атрибут аудио и видео HTML5 «controlList».Это экспериментальный атрибут, но поддерживается в Chrome, и у нас есть для него использование.Например, мы хотим, чтобы следующий код был проверен в TinyMCE: 

<p>
    <audio controls="controls" controlsList="nodownload">
        <source src="some.mp3" type="audio/mpeg" />
        Your browser does not support the audio element.
    </audio>
</p>

Прямо сейчас 'controlsList = "nodownload"' не распознается и удаляется.

Документация Tiny MCE показывает, что добавление пользовательскихтеги и атрибуты возможны при использовании tinyMCE.init (https://www.tiny.cloud/docs/configure/content-filtering/#valid_elements).. Однако я рассмотрел источник 2sxc, и у меня не совсем ясен лучший способ сделать это в реализации TinyMCE в 2sxc.

Одной из возможностей является строка 2045 файла \ dist \ sxc-edit \ sxc-edit.js (2sxc 9.14). Там я добавил теги и атрибут к существующему validateAlso: 

    validateAlso: '@[class]' // allow classes on all elements, 
            + ',i' // allow i elements (allows icon-font tags like <i class="fa fa-...">)
            + ",hr[sxc|guid]" // experimental: allow inline content-blocks
            + ",audio[controlsList]"
            + ",video[controlsList]"

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

Как правильно это сделать

Ответы [ 2 ]

0 голосов
/ 04 января 2019

Вот обходной путь, позволяющий добавлять пользовательские атрибуты в тег HTML.Обратите внимание, что это решение работает для наших одноразовых потребностей с тегами аудио / видео HTML5, но может работать не для всех.

Сначала мы добавили идентификатор «my-player» к нашему аудиотэгу. 

<audio id="my-player" controls="controls">
  <source src="some.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

Затем мы добавили скрипт, который вставляет нужный атрибут, используя Настройки страницы DNN> Дополнительно> SEO>Теги заголовка страницы: 

<script>
$( document ).ready(function() {
$('#my-player').attr("controlsList", "nodownload");
});
</script>

В нашем случае эта вставка атрибута javascript дала желаемый эффект.

0 голосов
/ 10 декабря 2018

На данный момент tinyMCE не настраивается.Причина в том, что мы переходим к совершенно новой реализации пользовательского интерфейса, использующего Angular 7, и мы не хотим вводить дополнительные функции для миграции:)

Если вы действительно хотите это сделать, я рекомендую вамиспользуйте код для типа ввода "string-wysiwyg", чтобы создать свой собственный - давайте назовем его "string-wysiswyg-withfeatures" и зарегистрируем его как тип ввода (есть несколько блогов об этом) - затем настройте ваше поле наиспользуйте этот wysiwyg.

...