剪切、复制、粘贴事件

剪切、复制、粘贴事件

  • oncopy 事件在用户拷贝元素上的内容时触发。
  • onbeforecut 事件在用户剪切文本,且文本还未删除时触发触发。
  • oncut 事件在用户剪切元素的内容时触发。
  • onbeforepaste 事件在用户向元素中粘贴文本之前触发。
  • onpaste 事件在用户向元素中粘贴文本时触发。

clipboardData 对象

剪切、复制、粘贴事件的 event 提供了一个 clipboardData 属性,该属性包含了剪切板数据,可以设置和读取剪切板内容。

能触发 paste 事件的元素

绑定 paste 事件的元素要聚焦后才能触发粘贴方法。

但不是所有元素聚焦后都能触发粘贴事件,input、textarea、contenteditable=“true” 这3种元素聚焦后粘贴就能触发粘贴事件,其他元素要点击一下元素才能触发,点击也就是聚焦行为。

如果一个 div 上绑定的粘贴事件想要被触发,首先要让其聚焦。但是 div 不是表单元素,不能直接通过 focus() 来使其聚焦,需要在div元素上增加 contenteditable=“true” 先使其变成可编辑元素(该类元素可以使用focus来聚焦),然后给div绑定onmouseenter和onmouseleave方法,鼠标移入时使其聚焦,移出时失焦,这样就能在鼠标移入div区域时粘贴触发onpaste事件。

聚焦后div元素会出现光标

可以设置 div 元素的 opacity 为 0,或者给 div 加上如下样式即可:

{
    outline: none;    
    color:transparent; 
    text-shadow:0 0 0 #000;
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值