我正在寻找HTML属性："contenteditable = 'true'"和javascript："focus()"函数的更多选项/信息

Question

我想了解更多关于"HTML contenteditable='true'"属性和javascript焦点((函数的信息。例如，我想知道如何影响聚焦线的位置，或者如何编辑聚焦线的背景。我已经在谷歌上搜索了一些东西，但找不到正确的信息。

有人有好的小费吗？

Answer 1

您可以通过在Google Chrome控制台中写入以下内容来检查哪个元素处于焦点上：

document.activeElement

contenteditable属性指定元素的内容是否可编辑。

如果你想触发对内容可编辑元素的关注，你可以通过：

$(".contenteditableClassName").focus();

这个元素上的任何其他背景更改都是由CSS完成的，例如你可以使用

.no-touchevents &:hover, &:focus, &:active {
border-color: white;
color: blue;

您可以通过这种方式对焦点上的元素应用不同的更改。

此外，您还可以使用删除点击时的焦点边界

.pointer-focus &:focus {
outline: none;
}