Js操作剪切板

Js操作剪切板

2023年7月9日发(作者:)

Js操作剪切板由于要在页⾯实现⼀个点击复制的功能,总结⼀下实现⽅法⽅法⼀:原⽣js实现 Var text = mentById("text") a("Text",text); 缺点:只⽀持IE.不⽀持ff,chrome,edge 优点:原⽣js,如果能实现兼容所有的浏览器的⽅法,那就是完美的⽅法⼆: 先说优缺点: 优点:兼容firefox,chrome,ie,edge 缺点:利⽤flash技术(flash估计马上要完了)1. jquery(zclip依赖jquery)2. 在页⾯引⼊js⽂件3. 将加⼊到项⽬中

操作事例:

点击复制function bind_copy(){ $("#copy").zclip({path:"<%=path%>/",copy:function(){ return $("#invite").text();}, beforeCopy:function(){ //…….}afterCopy:function(){var copy = mentById("copy");TML = "已复制成功";="red";}});} 注意事项:可以将绑定事件绑定在$(document).ready()中,但是如果你的id=copy(如上例)处于display:none;的状态,将不会复制成功:原因可以看代码(标红):/** zClip :: jQuery ZeroClipboard v1.1.5** Copyright 2011, SteamDev** Released under the MIT license.*/

(function (jQuery) {

= function (params) {

if (typeof params == "object" && !) {

var settings = ({}, ts, params);

return (function () {

var o = jQuery(this);

if ((':visible') && (typeof == 'string' || tion())) {

iePath();var clip = new ();

if (tion()) {('zClip_copy', );}

if (tion(Copy)) {('zClip_beforeCopy', Copy);} if (tion(opy)) {('zClip_afterCopy', opy);}

dCursor(dCursor);

Effects(Effects);

ntListener('mouseOver', function (client) {r('mouseenter');});

ntListener('mouseOut', function (client) {r('mouseleave');});

ntListener('mouseDown', function (client) {

r('mousedown');

if (tion(Copy)) {r('zClip_beforeCopy');}

if (!tion()) {t();} else {t(rHandler('zClip_copy'));}

});

ntListener('complete', function (client, text) { if (tion(opy)) {

r('zClip_afterCopy');

} else {if ( > 500) {text = (0, 500) + "...nn(" + ( - 500) + " characters not shown)";}

Class('hover');alert("Copied text to clipboard:nn " + text);}

if (fter) {r('click');}

});

(o[0], ()[0]);

jQuery(window).bind('load resize', function () {tion();});

}

});

} else if (typeof params == "string") {

return (function () {

var o = jQuery(this);

params = rCase();var zclipId = ('zclipId');var clipElm = jQuery('#' + zclipId + '.zclip');var clientId = ('id').replace(/^.*_/g, '') || null;

if (params == "remove") {

();Class('active hover');('zClip_copy');('zClip_beforeCopy');('zClip_afterCopy');ster(clientId);

} else if (params == "hide") {

();Class('active hover');

} else if (params == "show") {

();

}

});

}

};

})(jQuery);

// ZeroClipboard// Simple Set Clipboard System// Author: Joseph Huckabyvar ZeroClipboard = {

version: "1.0.7",clients: {},// registered upload clients on page, indexed by idmoviePath: '',// URL to movienextId: 1,// ID of next movie

defaults: {path: '',clickAfter: true,setHandCursor: true,setCSSEffects: true,

copy: null,// a string or function that returns string

beforeCopy: null,afterCopy: null},

jQuery: function (thingy) {// simple DOM lookup utility functionif (typeof(thingy) == 'string') thingy = mentById(thingy);if (!ss) {// extend element with a few useful = function () {y = 'none';}; = function () {y = '';};ss = function (name) {Class(name);ame += ' ' + name;};Class = function (name) {var classes = (/s+/);var idx = -1;for (var k = 0; k < ; k++) {if (classes[k] == name) {idx = k;k = ;}}if (idx > -1) {(idx, 1);ame = (' ');}return this;};ss = function (name) {return !!(new RegExp("s*" + name + "s*"));};}return thingy;},

setMoviePath: function (path) {// set path to ath = path;},

dispatch: function (id, eventName, args) {// receive event from flash movie, send to clientvar client = s[id];if (client) {eEvent(eventName, args);}},

register: function (id, client) {// register new client to receive s[id] = client;},

unregister: function (id) {if (typeof(id) === 'number' && Property(id)) {delete s[id];}},

getDOMObjectPosition: function (obj, stopObj) {// get absolute coordinates for dom elementvar info = {left: 0,top: 0,width: ? : Width,height: ? : Height};

if (obj && (obj != stopObj)) { += Left; += Top;}

return info;}, Client: function (elem) {// constructor for new simple upload rs = {};

// unique = ++;d = 'ZeroClipboardMovie_' + ;

// register client with singleton to receive flash er(, this);

// create movieif (elem) (elem);}};

ype = {

id: 0,// unique ID for usready: false,// whether movie is ready to receive events or notmovie: null,// reference to movie objectclipText: '',// text to copy to clipboardhandCursorEnabled: true,// whether to show hand cursor, or default pointer cursorcssEffects: true,// enable CSS mouse effects on dom containerhandlers: null,// user event handlersglue: function (elem, appendElem, stylesToAdd) {// glue to DOM element// elem can be ID or actual DOM element ment = (elem);

// float just above object, or zIndex 99 if dom element isn't setvar zIndex = 99;if () {zIndex = parseInt(, 10) + 1;}

if (typeof(appendElem) == 'string') {appendElem = (appendElem);} else if (typeof(appendElem) == 'undefined') {appendElem = mentsByTagName('body')[0];}

// find X/Y position of domElementvar box = ObjectPosition(ment, appendElem);

// create floating DIV above = Element('div');ame = "zclip"; = "zclip-" + d;jQuery(ment).data('zclipId', 'zclip-' + d);var style = ;on = 'absolute'; = '' + + 'px'; = '' + + 'px'; = '' + + 'px'; = '' + + 'px'; = zIndex;

if (typeof(stylesToAdd) == 'object') {for (var addedStyle in stylesToAdd) {style[addedStyle] = stylesToAdd[addedStyle];}}

// oundColor = '#f00'; // Child();

TML = L(, );},

getHTML: function (width, height) {// return HTML for movievar html = '';var flashvars = 'id=' + + '&width=' + width + '&height=' + height;

if ((/MSIE/)) {// IE gets an OBJECT tagvar protocol = (/^https/i) ? '' : '';html += '';} else {// all other browsers get an EMBED taghtml += '';}return html;},

hide: function () {// temporarily hide floater offscreenif () { = '-2000px';}},

show: function () {// show ourselves after a call to hide()tion();},

destroy: function () {// destroy control and floaterif (ment && ) {();TML = '';

var body = mentsByTagName('body')[0];try {Child();} catch (e) {//do nothing}

ment = null; = null;}},

reposition: function (elem) {// reposition our floating div, optionally to new container// warning: container CANNOT change size, only positionif (elem) {ment = (elem);if (!ment) ();} if (ment && ) {var box = ObjectPosition(ment);var style = ; = '' + + 'px'; = '' + + 'px';}},

setText: function (newText) {// set text to be copied to xt = newText;if () {t(newText);}},

addEventListener: function (eventName, func) {// add user event listener for event// event types: load, queueStart, fileStart, fileComplete, queueComplete, progress, error, canceleventName = ng().toLowerCase().replace(/^on/, '');if (!rs[eventName]) {rs[eventName] = [];}rs[eventName].push(func);},

setHandCursor: function (enabled) {// enable hand cursor (true), or default arrow cursor (false)rsorEnabled = enabled;if () {dCursor(enabled);}}, setCSSEffects: function (enabled) {// enable or disable CSS effects on DOM ects = !! enabled;},

receiveEvent: function (eventName, args) {// receive event from flasheventName = ng().toLowerCase().replace(/^on/, '');

// special behavior for certain eventsswitch (eventName) {case 'load':// movie claims it is ready, but in IE this isn't always // bug fix: Cannot extend EMBED DOM elements in Firefox, must use traditional = mentById(d);var self = this;

if (!) {setTimeout(function () {eEvent('load', null);}, 1);return;}

// firefox on pc needs a "kick" in order to set these in certain casesif (! && (/Firefox/) && (/Windows/)) {setTimeout(function () {eEvent('load', null);}, 100); = true;return;} = true;try {t(xt);} catch (e) {}try {dCursor(rsorEnabled);} catch (e) {}break;

case 'mouseover':if (ment && ects) {ss('hover');if (rActive) {ss('active');}

}break;

case 'mouseout':if (ment && ects) {rActive = false;if (ss('active')) {Class('active');rActive = true;}Class('hover');

}break;

case 'mousedown':if (ment && ects) {ss('active');}break;

case 'mouseup':if (ment && ects) {Class('active');rActive = false;}break;} // switch eventNameif (rs[eventName]) {for (var idx = 0, len = rs[eventName].length; idx < len; idx++) {var func = rs[eventName][idx];

if (tion(func)) {// actual function referencefunc(this, args);} else if ((typeof(func) == 'object') && ( == 2)) {// PHP style object + method, i.e. [myObject, 'myMethod']func[0][func[1]](this, args);} else if (typeof(func) == 'string') {// name of functionwindow[func](this, args);}} // foreach event handler defined} // user defined handler for event}

};

发布者:admin,转转请注明出处:http://www.yc00.com/news/1688853698a176693.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信