Почему execCommand(‘createLink’) не работает в Firefox?
Когда я выделяю текст, над ним появляется тулбар с кнопкой «create link», по клику на эту кнопку появляется input и курсор сразу фокусируется на этом инпуте, ввожу ссылку, нажимаю enter, и в firefox ничего не происходит ( ссылка не создается ), в chrome и safari все работает отлично, в чем может быть причина?
events:< 'click .link': 'toggleLink', 'keypress [name="link"]': 'setUrl' >,
сами функции ивентов:
toggleLink: function(e) < if(this.options.nodes.url)< this.$el.find('[name="link"]').val(this.options.nodes.url); >this.lastRange = window.getSelection().getRangeAt(0); this.$el.find('[name="link"]').focus(); >, setUrl: function(e) < if(e.which == 13)< e.preventDefault(); this.$el.find('[name="link"]').blur(); window.getSelection().addRange(this.lastRange); var url = $(e.currentTarget).val(); if(url.length >0)< document.execCommand('createLink', false, url); >else < document.execCommand('unlink', false, null); >> >
что я делаю не так и почему firefox не хочет понимать что я ввел ссылку? спасибо!
- Вопрос задан более трёх лет назад
- 2662 просмотра
Document.execCommand()
Когда HTML документ переключён в режим редактирования ( document.designMode ), для него будет доступен метод execCommand , который предоставляет команды для работы с контентом в редактируемой области. Большинство команд влияют на выделение (bold, italics, и т. п.), другие вставляют новые элементы (createLink) или влияют на всю строку (indenting). При использовании contentEditable , вызов execCommand влияет на активный редактируемый элемент.
Синтаксис
execCommand(String aCommandName, Boolean aShowDefaultUI, String aValueArgument)
Аргументы
String aCommandName
имя команды
Boolean aShowDefaultUI
нужно ли показать пользовательский интерфейс по умолчанию. Это не реализовано в Mozilla.
String aValueArgument
некоторым командам (например insertimage) также требуется значение аргумента (url картинки). Если аргумент не нужен введите null .
Команды
backColor
Изменить цвет фона документа. В режиме styleWithCss командой устанавливается цвет фона родительского блока. Необходима передача строкового значения цвета в качестве аргумента. (Internet Explorer таким образом устанавливает цвет фона текста.)
bold
Включает/отключает выделение жирным bold отмеченного текста или начиная с места ввода текста. (Internet Explorer использует тег вместо .)
contentReadOnly
Делает содержимое документа либо неизменяемым либо редактируемым. Требуется передача булевого true/false в качестве аргумента. (Не поддерживается Internet Explorer.)
copy
Копирует выделенное в буфер обмена. Возможность такого поведения отличается от браузера к браузеру и расширяется со временем. Следует проверить таблицу совместимости, чтобы убедиться в возможности использования.
createLink
Создаёт ссылку из выделения, если таковое имеется. Необходима передача HREF URI в качестве аргумента. URI должен содержать как минимум один символ, допускается пробельный. (Internet Explorer создаст ссылку и без URI.)
cut
Вырезает выделенное и помещает его в буфер обмена. Возможность такого поведения отличается от браузера к браузеру и расширяется со временем. Следует проверить таблицу совместимости, чтобы убедиться в возможности использования.
decreaseFontSize
Добавляет тег (en-US) вокруг выделения или с места ввода текста. (Не поддерживается Internet Explorer.)
delete
Удаляет выделенное.
enableInlineTableEditing
Включает/выключает возможность вставки и удаления строк/столбцов таблицы. (Не поддерживается Internet Explorer.)
enableObjectResizing
Включает/выключает возможность изменения размера картинок и других объектов. (Не поддерживается Internet Explorer.)
fontName
Изменяет название шрифта для выделенного текста или с места ввода текста. Требует передачи в качестве аргумента наименования шрифта (напр., «Arial»)
fontSize
Изменяет размер шрифта выделенного текста или с места ввода текста. Требует передачи в качестве аргумента размера шрифта (1-7).
foreColor
Изменяет цвет шрифта выделенного текста или с места ввода текста. Требует передачи в качестве аргумента наименования шрифта.
formatBlock
Добавляет тег HTML-блока вокруг строк, содержащих в себе выделенный текст, заменяя блочный элемент, содержащий такие строки, если он существует (в Firefox, BLOCKQUOTE является исключением — он обернёт любой блочный элемент). Требует передачи в качестве аргумента наименования Тега. Теоретически может использоваться любой блочный тег (напр., «H1», «P», «DL», «BLOCKQUOTE»). (Internet Explorer поддерживает только теги заголовков H1 — H6, ADDRESS и PRE, которые должны также быть заключены в символы < >, как например: «».)
forwardDelete
Удаляет символ справа от курсора, так же как при нажатии на клавишу delete.
heading
Добавляет тег заголовка вокруг выделенного текста либо в месте, где установлен курсор. Требует передачи строки имени тега в качестве аргумента. (то есть «H1», «H6»). (Не поддерживается в Internet Explorer и Safari)
hiliteColor
Изменяет цвет фона для выделенного текста либо в месте, где установлен курсор. Требует передачи цвета в качестве аргумента. UseCSS должен быть включён для работы этой функции. (Не поддерживается в Internet Explorer)
increaseFontSize
Добавляет тег BIG вокруг выделенного текста или на месте курсора. (Не поддерживается в Internet Explorer)
indent
Добавляет отступ в строку, в которой расположен курсор (или что-то выделено). В Firefox, если выделение охватывает несколько строк с разными уровнями отступа, будут сдвинуты только строки с наименьшим отступом.
insertBrOnReturn
Добавляет тег или разбивает текущий элемент на два блока. Не работает в Internet Explorer
insertHorizontalRule
Вставляет горизонтальную линию на месте курсора (удаляет выделение).
insertHTML
Вставляет HTML текст на месте курсора (удаляет выделенный текст). Требует передачи правильной HTML строки в качестве аргумента. (Не поддерживается в Internet Explorer)
insertImage
Вставляет изображение на место курсора (удаляет выделенный текст). Необходимо указывать ссылку на изображение в параметре «aValueArgument». (Internet Explorer может создавать изображения с пустым SRC)
insertOrderedList
Создаёт пронумерованный список из выбранного или на месте курсора.
insertUnorderedList
Создаёт список из выбранного или на месте курсора.
insertParagraph
Вставляет параграф вокруг выделения или для текущей строки. (Internet Explorer вставляет параграф в месте курсора и удаляет выделенный текст)
insertText
Вставляет простой текст в месте курсора или выделения (выделенный текст будет заменён).
italic
Переключает курсив в месте курсора или выделения. (Internet Explorer использует теги вместо (en-US).)
justifyCenter
Центрирует строку, в которой есть выделение или установлен курсор.
justifyFull
Выравнивает по ширине строку, в которой есть выделение или установлен курсор.
justifyLeft
Выравнивает по левому краю строку, в которой есть выделение или установлен курсор.
justifyRight
Выравнивает по правому краю строку, в которой есть выделение или установлен курсор.
outdent
Добавляет выступ для строки, в которой расположен курсор (или что-то выделено).
paste
Вставляет данные из буфера обмена в место курсора или выделения (последнее заменяется). Доступ к буферу обмена должен быть включён в файле user.js
redo
Повтор последнего действия. (Если было отменено с помощью undo или ctrl+z)
removeFormat
Очищает форматирование для выделенного.
selectAll
Выделяет всё в редактируемом документе.
strikeThrough
Переключает зачёркивание текста для выделения или на месте курсора.
subscript
Переключает нижний индекс для выбранного или на месте курсора.
superscript
Переключает верхний индекс для выбранного или на месте курсора.
underline
Переключает подчёркивание для выбранного или на месте курсора.
undo
Отменяет последнее действие.
unlink
Удаляет ссылку или якорь для выбранной ссылки/якоря
useCSS Устарело
Переключает режим стилизации HTML и CSS для генерируемой разметки. Может принимать только булевы значения true/false. ПРИМЕЧАНИЕ: этот аргумент с перевёрнутой логикой (т.е. false = CSS / true = HTML). (Не поддерживается в Internet Explorer.) Внимание! Эта команда является устаревшей, используйте styleWithCSS.
styleWithCSS
Заменяет команду useCSS. Аргумент работает как ожидалось, т.е. true модифицирует/генерирует атрибуты стиля в разметке, false генерирует элементы форматирования.
Пример
iframeNode.execCommand("bold"); // Жирный текст iframeNode.execCommand("undo"); // Отмена последнего действия iframeNode.execCommand("insertText", false, "Lorem ipsum dolor sit amet, consectetur adipisicing elit."); // Вставка текста
Спецификации
Specification |
---|
Trusted Types # dom-document-execcommand |
Совместимость с браузерами
BCD tables only load in the browser
Смотрите также
- document.contentEditable
- document.designMode
- Rich-Text Editing в Mozilla
Почему не срабатывает execcommand
Код ниже работает везде кроме ФФ.
Проблема похоже с focus() или SelectAll, потому что текст вставляется, но не в input а родительский объект.
function doLoad() setTimeout(function() var elem = document.getElementById(«name»);
elem.focus();
document.execCommand(«selectAll»);
document.execCommand(«insertText», false, «12345678»);
document.designMode = «off»;
>,
1000);
>
Мне нужно, чтобы текст был заменен в самом input элементе.
Помогите разобраться с проблемой.
Спасибо.
Почему не срабатывает execcommand
Здравствуйте!
Ребят, кто умеет копировать текст из блока в буфер обмена, отзовитесь!
Казалось бы такая простая задачка, но это ж ёб. джаваскрипт, тут пока не заплюёшь весь экран по десятому разу, ничего не получится.
В общем почти все советы идут через «execCommand(‘copy’)«, но в документации написано, что этот метод устарел (да какая разница один хрен не работает), поэтому не хотелось бы его использовать.
Однако ж инновационно-новый, супер-пупер АХ. какой хороший «window.navigator.clipboard.writeTex t(‘$temp’)» не работает, потому что этот самый clipboard равен ундефинед, как я понимаю (почитав документацию через третьи руки) к нему нельзя получить доступ, если у тебя не https.
А что же нам, простым сайтам с древним http и локальным серверам теперь уже невозможно выполнить простейшее действие, скопировать текст в буфер.
Поможите, чем можите.
Последний раз редактировалось begovik; 07.04.2021 в 09:40 .
Пользователь
Регистрация: 08.03.2010
Сообщений: 48
Неужели никому не приходилось копировать текст из блока.
Или я один такой криворукий и у всех это работает по стандартным советам на форумах?
Участник клуба
Регистрация: 19.01.2009
Сообщений: 1,452
Делайте проверку на существование обьекта и используйте тот вариант который поддерживает браузер.
Пример:
function clipboard (text) < if (!text) return; if ('clipboard' in navigator) < navigator.clipboard.writeText(text); return; >; var input = document.createElement('input'); document.body.appendChild(input); input.style.cssText = 'position:fixed; top:-999px; left:-999px; width:1px; height:1px;'; input.value = text; input.select(); if (document.execCommand('copy')) < setTimeout(function () < input.remove(); >, 1000); > >
Пользователь
Регистрация: 08.03.2010
Сообщений: 48
Спасибо за участие конечно, но это то же самое что и на всех других форумах, и конечно не работает, пробовал на Хроме, Мозиле и Эдже.
Я же писал, что не работает либо .select, либо .execCommand
После
input.select();
делаю вывод
console.log(input.value);
и в консоли есть весь текст, но в буфере пусто.
И ещё один вывод делаю внутри таймаута, вывод в консоль отрабатывает, значит казалось бы
if (document.execCommand('copy'))
отрабатывает, но в буфере так ничего нового и не появляется.
А у вас что этот код работает?
Последний раз редактировалось begovik; 09.04.2021 в 17:18 .