个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在使用 angular 4 并尝试在 contenteditable 上工作
<div contenteditable='true' id='editor' [innerHtml]='data'></div>
我需要检测粘贴事件，然后处理数据以删除除粗体、斜体和 para 之外的所有内联 css 和 HTMl 标记，然后将其粘贴为普通文本。
我已成功检测到粘贴事件
document.getElementById('editor').addEventListener('paste', handlePaste);
function handlePaste(e) {
var clipboardData, pastedData;
// Stop data actually being pasted into div
clipboardData = e.clipboardData;
pastedData = clipboardData.getData('text/html');
e.stopPropagation();
e.preventDefault();
}
我能够操作 pastedData 但无法启动粘贴行为。使用 preventDefault 和 stopPropagation 我能够停止粘贴的默认行为，并且使用 getData 我能够从剪贴板中提取数据。但现在我被困在这里，无法启动粘贴事件。在文档中说我们需要创建一个自定义事件，如 pasteClipboardData(newData)。但是我可以找到有关如何创建此类事件的任何引用。
// Since we are canceling the paste operation, we need to manually
// paste the data into the document.
pasteClipboardData(newData);
最佳答案
您不需要发送另一个 paste 事件。只需将您想要的内容插入 contenteditable。
这是一个使用 document.execCommand("insertHTML", ...) 的示例 - 查看其他问题(如 this one )以使其在 IE 中工作:
window.onload = function() {
document.addEventListener('paste', function(e){
console.log("paste handler");
var s = e.clipboardData.getData('text/html').replace("this", "that")
document.execCommand("insertHTML", false, s);
e.preventDefault();
});
}<html>
<p>1) copy <b>this</b> text</p>
<div contenteditable id="target">
<p>2) paste it here: ... ('this' should be replaced by 'that')</p>
</div>关于javascript - 如何在 preventDefault 之后创建粘贴事件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46645587/
25
4
0
我正在尝试使用 this website 中的颜色 slider , 这是 source code .以下代码的作用是:line 134 if (e.preventDefault) e.prevent
在阅读有关 native 拖放事件的教程时，我遇到了一个检查 e.preventDefault 的条件语句。打电话前 e.preventDefault() .这个条件可以写成: e.preventDe
我只看到下面的代码here : function wheel(e) { preventDefault(e); } 以前我习惯这样使用: function wheel(e) { e.preven
这两者有什么区别吗？或者只是其中一个的缩写？ e.preventDefault() and event.preventDefault() 最佳答案 好吧，唯一的区别是传递到监听器的事件对象的名称。如果
即使存在 preventdefault 和 returnvalue = false，表单仍会在 IE 中提交。在 Chrome 和 Firefox 中一切正常。 我也尝试过 event.stopPro
我有 2 个 jQuery 脚本 - 一个是在添加 .preventDefault 之前，另一个是在添加 .preventDefault 之后相同脚本的副本。 jQuery 在初始时可以工作，但在添加
我正在尝试解决 jQuery 教科书提供的问题。读起来是这样的 “即使没有进行任何输入，数据也会被提交，要解决此问题，您必须停止提交按钮的默认操作。为此，请在 if 语句末尾编写事件对象的 Preve
使用 .preventDefault() 进行浏览器表单验证时出现问题 有没有办法让浏览器检查所需输入的验证，但停止提交？ 是否有任何标志可以用来获取表单是否有效？ 谢谢 更新:同时使用主干和 jqu
我有以下代码: $(document).ready(function(){ $("div.subtab_left li.notebook a").click(function(event) {
有谁知道是否有办法阻止Default()，但是在计时器上，以便在一定时间后恢复默认操作？ 这是我到目前为止所拥有的: function setResetInterval(bool){ var el
我正在构建一个带有基于触摸的下拉菜单的菜单，一切都工作得很好，除了当一个人单击父级时，我希望它只激活下拉菜单，而不是转到父级 href 中列出的链接。因此，我尝试使用 PreventDefault()
//prevent default handler function click_handler(event){ if(event.shiftKey){ even
我想删除标签重定向超链接。目前单击它会打开一个模式，但我不想重定向浏览器。我尝试了 preventDefault 但它对我不起作用。 我正在使用 C# MVC。可能是我其他地方重载了？或者有其他解决方
我有一个非常简单的表格: .... .... Submit 这是其背后的脚本: // Landing page form submit $("#formRegis
我遇到的情况是，我需要在单击链接时触发谷歌分析事件。我为此目的编写了一个处理程序: handleClick(e){ e.preventDefault(); // ---------------
我正在编写一个小脚本，当单击菜单项时，它基本上会切换子菜单。 我设法让它工作，但我有一个问题，我使用 PreventDefault 来实现该功能，因此当单击父链接时，会显示子菜单。 问题是，preve
我在理解 PreventDefault 函数的工作原理时遇到问题。我创建了一个简单的 jsfiddle，但是选择和扩展仍然有效并且没有被阻止。 http://jsfiddle.net/XRfKb/15
在 osx 10.6.8 上使用 chrome 15 当添加事件监听器时，我发现在使用 keypress 事件时将 preventDefault 放入，我会遇到很多问题。 Take a look he
我有这个列表采用不同的选项并根据单击的选项重新路由。 html代码为: Choose Page Page 1 Page 2
计划是将 id #required 设置为点击时的必填字段。这不起作用: $("#submitformat").click(function( event ) { $("#required").p
我是一名优秀的程序员,十分优秀！