您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
简单富文本编辑
此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/534392/1580077/spellRicher.js
- //altered from https://github.com/ninja33/ODH/blob/master/src/fg/js/spell.js
- ;
- function spell() {
- let exec = (command, value = null) => document.execCommand(command, false, value)
- let ensureHTTP = url => /^https?:\//.test(url) ? url : `https://${url}`
- let $ = (tag, props, children = [], elm = document.createElement(tag)) =>
- children.map(child => child && elm.appendChild(child)) && Object.assign(elm, props)
- let colorPicker = _ => $('input', {type: 'color'})
- let select = options => $('select', {}, options.map(o => $('option', {textContent: o})))
- let buttons = {};
- let queryState = _ => {
- for (let cmd in buttons)
- buttons[cmd].classList.toggle('selected', document.queryCommandState(cmd))
- }
- let actions = [
- [
- ['bold'],
- ['italic'],
- ['underline']
- ],
- [
- ['paragraph', '<p>'],
- ['quote', '<blockquote>'],
- ['code', '<pre>']
- ].map(([title, format]) => [title, _ => exec('formatBlock', format)]),
- [
- ['insertOrderedList'],
- ['insertUnorderedList'],
- ['insertHorizontalRule'],
- ],
- [
- ['removeFormat'],
- ['unlink']
- ],
- [
- ['createLink', 'link', ensureHTTP],
- ['insertImage', 'image', img => img]
- ].map(([cmd, type, t]) => [type, url => (url = prompt(`Enter the ${type} URL`)) && exec(cmd, t(url))]),
- [
- ['undo'],
- ['redo']
- ]
- ]
- return $('div', {className: 'spell'}, [
- $('div', {className: 'spell-bar'}, actions.map(
- bar => $('div', {className: 'spell-zone'}, bar.map(
- ([cmd, onclick = _ => exec(cmd), control]) => buttons[cmd] = $('button', {
- className: 'spell-icon',
- title: cmd.replace(/([^a-z])/g, ' $1').toLowerCase(),
- onclick
- }, [$('i', {className: 'icon-' + cmd.toLowerCase()}), control])
- ))
- )),
- $('div', {
- className: 'spell-content',
- contentEditable: true,
- onkeydown: event => event.which !== 9,
- onkeyup: queryState,
- onmouseup: queryState
- })
- ])
- }