如何强制浏览器在 Edge 中粘贴 url 而不是页面标题

Question

我需要用户将来自外部网站的 url 复制粘贴到我网页的可编辑 div 中 ("contentEditable="true")

在Edge中，当用户粘贴url时，它会自动粘贴页面标题而不是url。

我想强制浏览器粘贴 url 而不是页面标题。我该怎么做？

非常感谢

.editablediv {
  height: 50px;
  width: 300px;
  background-color: lightgray;
  padding: 3px 3px 3px 3px;
}

<div contentEditable="true" class="editablediv">https://</div>

Answer 1

它将标题粘贴到 Edge 中，因为 Edge 中有一个复制和粘贴设置。你可以在 Edge 中看到默认情况下，它会粘贴链接而不是纯文本：

如果你想强制它粘贴 url（纯文本），你可以使用下面的代码。它将捕获粘贴事件并允许您直接以文本形式获取剪贴板数据：

document.querySelector("div[contenteditable]").addEventListener("paste", function(e) {
  e.preventDefault();
  var text = e.clipboardData.getData("text/plain");
  document.execCommand("insertHTML", false, text);
});

.editablediv {
  height: 50px;
  width: 300px;
  background-color: lightgray;
  padding: 3px 3px 3px 3px;
}

<div contentEditable="true" class="editablediv">https://</div>