html contentEditable document.exec命令更改选定的不透明度

任何人都选择了在contentEditable上更改不透明度.

我试过以下:

document.execCommand('foreColor',false,'rgba(0,0.5)'); // with rgba
document.execCommand('foreColor','80000000'); // with alpha hex

没人工作.但我可以轻松改变颜色:

document.execCommand('foreColor','000000');

任何人都可以通过document.execCommand帮助我改变不透明度吗?

更新

进一步搜索发现:

document.execCommand’foreColor’使用给定颜色添加字体标签.但遗憾的是HTML5中不支持颜色属性.

这就是问题吗?它的替代品是什么?

解决方法

您必须使用styleWithCSS命令,该命令指定execCommand方法是否应将CSS或HTML格式生成到文档中.

请参阅此处的规格:https://dvcs.w3.org/hg/editing/raw-file/tip/editing.html#the-stylewithcss-command.

因此,在这种情况下,传递true以使用CSS样式而不是生成字体标记.

片段:

function setColor() {
    document.execCommand('styleWithCSS',true);
    document.execCommand('foreColor',"rgba(0,0.5)");
}
<p contentEditable="true" onmouseup="setColor();">this is some text</p>

这将生成应用了CSS的HTML,如下所示:

<p contenteditable="true" onmouseup="setColor();">
    this is <span style="color: rgba(0,0.498039);">some</span> text
</p>

希望有所帮助.

.

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些