在一些查询input输入时,用户可能会从某个地方复制查询数据,然后粘贴到查询表单中,这时可能会造成复制的数据有空格,而恰巧你点表单又进行了位数设置,则复制出来的数据可能会因此少一位。
我的解决方案
:
监听粘贴动作,在粘贴前把剪切板里的数据进行去空格处理,然后将处理好的数据添加到input文本框内。
示例代码
:
<title>粘贴监听测试</title>
<style>
DIV#editable {
width: 400px;
height: 300px;
border: 1px dashed blue;
</style>
<script type="text/javascript">
window.onload=function() {
//粘贴监听,删除剪切板的空格后进行粘贴
function paste_text(e) {
debugger;
if ( e.clipboardData.items ) {
ele = e.clipboardData.items
//判断剪切板内复制的是文本
alert("type:"+ele[0].type+",kind:"+ele[0].kind);
if(ele[0].type=='text/plain' && ele[0].kind=='string'){
var text = e.clipboardData.getData('Text');
alert("剪切板内容:"+text);
//去空格并截取前11位赋值到input中
document.getElementById('q_phone').value=text.trim().substring(0,11);
} else {
alert('non-chrome');
document.getElementById('q_phone').onpaste=function(){paste_text(event);return false;};
</script>
</head>
<input id="q_phone" type="text" class="form-control input-sm" placeholder="粘贴监听区域" maxlength="11">
</body>
</html>
最近项目
需要
,要实现复制黏贴功能,之前做好了只能实现自己页面的复制黏贴 (也不是真正的复制黏贴 是通过投机取巧的,就是复制的时候把数据存入数组,黏贴的时候再把数据取出来),没法实现把数据存入本地的剪贴板然后可以自己一个文档中实现
粘贴
,所以就找了一下资料,找到了主要的有四种方法: z...
document.execCommand()方法用来操作当前聚焦的可编辑元素(`input`、`textarea`)中的内容,例如复制、剪贴、
粘贴
、删除、
文本
加粗、插入图片等等效果。
Clipboard API 提供了响应剪贴板命令和异步读写系统剪贴板的能力,该API是用来取代document.execCommand() 这种剪贴板
访问
方式的。
JavaScript操作剪贴板虽然存在安全问题,但在某些应用场景下还是很方便的,比如复制一个link 等,JavaScript操作剪贴板的方式有:
方式1. 使用navigator 的Clipboard 对象
方式2. 使用 document.execCommand
方式3. window.clipboardData 对象
方式4. 使用一些封装的第三方库
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge
function copy(data) {
let transfer = document.createElement('input');
document.body.appendChild(transfer);
transfer.value = data; // 这里表示想要复制的内容
transfer.focus();
文章目录Document.execCommand() 方法Clipboard 对象介绍Clipboard 对象方法
浏览器允许 JavaScript 脚本读写剪贴板,自动复制或
粘贴
内容。
一般来说,脚本不应该改动用户的剪贴板,以免不符合用户的预期。但是,有些时候这样做确实能够带来方便,比如"一键复制"功能,用户点击一下按钮,指定的内容就自动进入剪贴板。
目前,一共有三种方法可以实现剪贴板操作。
1. Document.execCommand()方法
2. 异步的 Clipboard API
基于auto.
js
实现的安卓剪贴板
监听
并控制钉钉机器人自动发送,企业内部有较多系统支撑着公司的核心业务流程。通过安卓手机剪贴板
监听
便捷控制钉钉自定义机器人,可以将这些系统
事件
同步到钉钉的聊天群。而基于auto.
js
编写的apk,为轻量级应用,工程量小,应用价值大。...
IE 支持使用 window.clipboardData 对象内的一系列方法
访问
系统剪贴板;Chrome 和 Safari 中存在类似的 Clipboard 对象,且有与 IE 中类似的方法,但其功能尚未实现;Firefox 和 Opera 不支持这类对象。
造成的影响
若作者在...