Html 如何在contentEditable div中制作可点击锚？

我有以下代码：

<div contentEditable="true">
    Blah blah <a href="http://google.com">Google</a> Blah blah
</div>

废话废话

---

有没有一种方法可以使这个

成为可点击的，不可编辑的，而无需将锚点移到该div之外？
只需将链接包装到另一个div中，如下所示：

<div contentEditable="true">

    <div contentEditable="false">
            Bla bla <a href="http://google.com">Google</a> Bla bla
    </div>
</div>​


呜呜呜呜呜呜
​
据我所知，如果不自己使用Javascript编程，就无法做到这一点。执行此操作的简单方法是在按下Ctrl键时禁用并重新启用
contentEditable
。因此，当按下Ctrl键时，链接是可点击的，否则不会。这意味着您仍然可以编辑链接的内容。此功能类似于Microsoft Word，IIRC

代码可能如下所示：

var content = document.getElementById('content');

document.addEventListener('keydown', function(event) {
    if (event.keyCode === 17) {          // when ctrl is pressed
        content.contentEditable = false; // disable contentEditable
    }
}, false);

document.addEventListener('keyup', function(event) {
    if (event.keyCode === 17) {          // when ctrl is released
        content.contentEditable = true;  // reenable contentEditable
    }
}, false);

使链接本身不可编辑（至少在HTML5上有效）：

为了获得一个可点击且可编辑的链接，我在链接中添加了onclick命令。
例如：

<a contenteditable="true" href="necessary?" onclick="document.location = 'www.xy.com';" ...>
    <img src="image.jpg" draggable="true" ...>
</a>



缺点是：
在IE中，链接必须点击两次。
在mobile Safari中显示了键盘（可以用Javascript隐藏）。
我更喜欢在锚外部和div内部单击时锚是否可编辑，但这种方式就足够了。谢谢锚文本在此不可编辑。是否可以在允许编辑锚文本的同时使链接可点击？将contentEditable=“false”添加到
在您的示例中，contentEditable div内的链接不可点击。我希望有可能解决这个问题。这个例子对我来说很好，尽管我正在使用SeaMonkey，IE可能无法正确处理这些事件…对我来说也很好（Vivaldi）。这打破了Ctrl+C，Ctrl+V