jquery - Contenteditable 自动将 CSS 应用于输入的文本

Question

有没有办法禁用 CSS(例如文本转换)对使用 contentedtiable 输入的文本的影响？

在我的页面上，“CERTIFICATE PROGRAM”显示为文本转换设置为大写。 实际输入的数据是:证书类(class)。

当我通过 contenteditable 在字段中键入时，添加的任何文本都会自动大写。

将 contenteditable CSS 设置为 text-transform:none;不起作用，因为显示文本是:证书程序，我想要“证书程序”

我可以将我的 CSS 设置用于显示目的，但不影响新输入的文本吗？

现在发生了什么:文本:证书程序，HTML:

<section id="name+degree+96" contenteditable="true">Certificate PrograMS</section>

我想要的:文本:证书程序，HTML:

<section id="name+degree+96" contenteditable="true">Certificate Programs</section>

Answer 1

如你所见here ，原始文本值不受 text-transform 的影响，因为它只会改变您查看文本的方式(编辑文本然后单击某处)。

我不知道你想要什么，问题不是很清楚，但是..

如果你想去掉那个部分的大写文本，只需用以下命令覆盖它:

section[contenteditable] {
   text-transform: none;
}

如果您想在编辑文本时去掉大写文本:

section[contenteditable]:focus {
   text-transform: none;
}