1.IE浏览器 window.clipboardData:

setData() //设置值

getData()//获取值

clearData()//删除值

            /*******
** IE 浏览器下支持window.clipboardData (兼容IE7+)
** 对于URL类型的数据失效
********/
//复制内容到黏贴板
$(':button:first').click(function () {
window.clipboardData.setData('text', "asdfasdfasdf");
//window.clipboardData.setData('URL', 'http://www.baidu.com/');
alert('复制成功');
});
//黏贴内容
$(':button:eq(1)').click(function () {
//获取黏贴板内容
/*
* 获取数据失败,返回null
*/
var result = window.clipboardData.getData('text');
//var result = window.clipboardData.getData('URL'); $('#txtTwo').html($('#txtTwo').html() + result);
}); //清空text数据
$(':button:eq(2)').click(function () {
window.clipboardData.clearData('text');
alert('清空成功');
});

2.IE7+和其他浏览器

1.文本框paste监听

            //paste 事件 支持 IE7+和其他
//1.禁用文本框的粘贴事件
//粘贴事件 paste
$('#txtOne').on('paste', function (e) {
e.preventDefault();
}); //注:使用jQuery 绑定事件,无法访问到 e.clipboardData
$('#txtOne').on('paste', function (e) {
console.info(e);
var clip = e.clipboardData;
var text = clip.getData('text');
$('.divOne').append(text + '<br>');
}); //2.监听paste
var txtOne = document.getElementById('txtOne');
EventUtil.addHandler(txtOne, 'paste', function (e) {
console.info(e);
event = EventUtil.getEvent(e);
var text = EventUtil.getClipboardText(event);
$('.divOne').append(text + '<br>');
}); //3.paste时 有选择粘贴
var txtOne = document.getElementById('txtOne');
EventUtil.addHandler(txtOne, 'paste', function (e) {
var event = EventUtil.getEvent(e);
var text = EventUtil.getClipboardText(event);
console.log(text.length);
if (text.length < 10) {
$('.divOne').append(text + '<br>');
}
else {
//禁用黏贴默认操作
EventUtil.preventDefault(event);
}
});

注:jquery event对象不能访问event.clipboardData  说明

jquery.event

dom.event 

2.contenteditable 元素paste事件监听

    <div id="divOne" class="divOne" contenteditable="true">
</div>
            //contenteditable 元素的paste事件
//1.监听paste事件
$('.divOne').on('paste', function (e) {
var thisText = $(this).text();
$('#result').append(thisText);
}); //2.监听paste事件2
var divOne = document.getElementById('divOne');
EventUtil.addHandler(divOne, 'paste', function (e) {
var event = EventUtil.getEvent(e);
var text = EventUtil.getClipboardText(event);
$('#result').append(text + "<br>");
});

使用帮助类:

var EventUtil = {
addHandler: function (element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
} else {
element["on" + type] = handler;
}
},
getEvent: function (event) {
return event ? event : window.event;
},
getClipboardText: function (event) {
var clipboardData = (event.clipboardData || window.clipboardData);
return clipboardData.getData("text");
},
setClipboardText: function (event, value) {
if (event.clipboardData) {
return event.clipboardData.setData("text/plain", value);
} else if (window.clipboardData) {
return window.clipboardData.setData("text", value);
}
},
preventDefault: function (event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
}
};

更多:

JavaScript操作剪贴板(转)

js 操作剪切板的更多相关文章

  1. Javascript操作剪切板数据(支持IE、Chrome、360、搜狗),亲测!

    clipboarddata只能在IE浏览器中使用,在chrome下会提示对象未定义!以下的方法支持IE.Chrome.360.搜狗等浏览器,其它浏览器还未验证. <!DOCTYPE html&g ...

  2. JS访问剪切板中的图片

    google出来一个html2canvas,它利用canvas来渲染读取的DOM树,也就是说它只能截取document里的内容,如果要像qq截图那样,应该怎么做?用过百度的Ueditor编辑器的朋友都 ...

  3. C# 使用WinApi操作剪切板Clipboard

    前言: 最近正好写一个程序,需要操作剪切板 功能很简单,只需要从剪切板内读取字符串,然后清空剪切板,然后再把字符串导入剪切板 我想当然的使用我最拿手的C#来完成这项工作,原因无他,因为.Net框架封装 ...

  4. JS从剪切板里粘贴图片

    功能需求:在网页中,Ctrl+V,把系统剪切板的图片(比如QQ截图)进行粘贴.显示.上传...,提高用户体验. 参考链接:https://ruby-china.org/topics/17266 git ...

  5. c#操作剪切板

    C#定义了一个类System.Windows.Forms.Clipboard来简化剪切板操作,这个类有一个静态方法,主要有: Clear 清除剪切板中的所有数据: ContainsData,Conta ...

  6. C#操作剪切板(Clipboard)

    剪切板是Windows系统提供的功能,从我最早接触到的Windows 3.2版本开始,就一直带着了.以前使用C++的时候,是直接使用Windows API对其进行操作的,到了.NET下,在WinFor ...

  7. js修改剪切板内容的方法

    代码如下: //绑定在了body上,也可以绑定在其他可用元素行,但是不是所有元素都支持copy事件. $(document.body).bind({ copy: function(e) {//copy ...

  8. 使用ZeroClipboard操作剪切板

    一.ZeroClipboard下载地址 点击下载 二.添加js引用 <script src="../Assets/js/jquery-1.8.3.min.js">< ...

  9. VBS操作剪切板

    '设置剪切板的内容 Dim Form, TextBox Set Form = CreateObject("Forms.Form.1") Set TextBox = Form.Con ...

随机推荐

  1. Asp.Net WebApi+Microsoft.AspNet.WebApi.Core 启用CORS跨域访问

    WebApi中启用CORS跨域访问 1.安装 Nugget包Microsoft.AspNet.WebApi.Cors This package contains the components to e ...

  2. arcmap从excel坐标数据生成点shp文件

    概述 今天试图在ArcMap中将excel数据转成点文件,在"Display XY Data"的时候,无法选择X,Y字段,很是纳闷,原来Excel中列的格式是文本,导致无法选择.有 ...

  3. MongoVUE查询备忘

    用了一段时间的MongoVUE,把一些在MongoVUE中常用的查询记录一下,以便查阅.1.and查询    查询date等于2016-01-08,并且page_url等于shouye.html   ...

  4. defer和async

    1.decument.wirte不能使用 2.<script src="text.js" type="text/javascript" defer=&qu ...

  5. 左右推拽显示对比图 - jQyery封装 - 附源文件

    闲来无事,做了一个模块效果 左右拖拽显示对比图,是用jq封装的 利用鼠标距离左侧(0,0)坐标的横坐标位移来控制绝对定位的left值 再配合背景图fixed属性,来制作视觉差效果 代码如下 <! ...

  6. Python 学习日记(第四周)

    set数据类型 先用一行代码来说明一下 #!/usr/bin/env python s2={} s = {33,12,33,32121} for i in s: print(i) print(type ...

  7. 容器 MAP

    1.equal_range pair <myMapDef::iterator,myMapDef::iterator> myresult; myPairDef ps=*MyMap1.begi ...

  8. iOS工程结构

          好的架构不是设计出来的,而是进化而来的! 写在前面 从2011年底开始学习iOS开发,到现在也已经快3年了,虽然中途没有一直进行iOS的开发(总是在Android和iOS间切换),但始终没 ...

  9. NGINX小技巧--将所有目录和目录下所有文件分别给与不同的权限

    为了安全,有时要将文件的权限进行限制,但,目录如果没有755,则不能进入. 所以需要分别给权限 find ./ -type f -name "*" |xargs ls -l

  10. js深入研究之扩展类,克隆对象,混合类(自定义的extend函数,clone函数,与augment函数)

    1.类扩展 /* EditInPlaceField类 */ /* 扩展函数 */ function extend(subClass, superClass) { var F = function() ...