Javascript 在更改之前（或“beforeinput”之前）获取contenteditable元素的textContent

我有

元素，我想添加一个eventListener，以便在对这些列表的任何

进行任何更改之前，将原始

文本内容

（即任何更改之前的文本）推送到

变量更改=[]

我尝试过使用

addEventListener（“beforeinput”…

，如下所示：

window.alternations=[]；
window.onload=（）=>{
document.getElementById（'main'）.addEventListener（“beforeinput”，（）=>{
警报（“事件已侦听！”）；
window.alternations.push（window.getSelection（）.anchorNode.parentElement.textContent）；
控制台日志（窗口更改）；
});
}

首先
第二
第三
第四
首先
第二
第三
第四

好的，这里应该可以：

window.alternations=[]；
window.onload=（）=>{
document.getElementById（'main'）。addEventListener（“键下键”，“事件）=>{
//0==在Palemon中删除，46==在其他浏览器中删除
/*某些字符需要ALT，如§和º，但要排除ALT、META等：
if（event.altKey | | event.metaKey）{return；}*/
if（event.key.length==1 | |[“输入”、“删除”、“退格”]。包括（event.key））{
//按下Ctrl时，仅当未按下Ctrl+V或Ctrl+X和ALT时触发：
if（event.key.toLowerCase（）！='v'&&event.key.toLowerCase（）！='x'&&event.ctrlKey&&event.altKey）{return；}
警报（“事件已侦听！”）；
window.alternations.push（window.getSelection（）.anchorNode.parentElement.textContent）；
控制台日志（窗口更改）；
}
});
}

首先
第二
第三
第四
首先
第二
第三
第四

beforeinput

对我有效：…您的初始脚本代码中似乎有一些错误，就像刚刚添加侦听器时一样。谢谢！我认为您是对的。可能是浏览器问题。我将Firefox升级到了v.59，现在在XAMPP中调试它时，我的许多原始代码无法正常工作。因此我改为PaleMoon，但它不起作用。但刷新它似乎起作用，可能是我忘记保存或其他什么。我正在关闭浏览器并再次测试，如果它起作用，我将关闭浏览器question@LGSon你能为我澄清一件事吗？当你运行我的代码片段时，它对你有用吗？只是重新检查-它在Palemon中不起作用，我要写一个新的s在Firefox中编写并测试它。但是我在Chrome的一个分支中测试了它，在这里，

beforeinput

起作用！在你的问题片段中，每次我按下一个键（但箭头键）它都会触发，使用Chrome，所以你需要一个解决方法。对于问题2，你可以查看

event.ctrlKey

。

Alt

和

Meta

@trysis还有其他标志，谢谢！我正在更新代码以反映这一点。另请参见：检查在输入之前

比Safari和Chrome更容易被其他浏览器使用