Zeroclipboard วิธีการใช้งานปุ่มคัดลอกเดียวและปุ่มคัดลอกหลายปุ่ม

Zeroclipboard เป็นคลาสไลบรารีข้ามเบราว์เซอร์ที่ใช้แฟลชสำหรับการคัดลอกดังนั้นจึงสามารถทำงานได้ตราบใดที่เบราว์เซอร์ติดตั้งแฟลชและมีความยืดหยุ่นมากกว่าเอกสารของ IE Execommand ("คัดลอก")

Zeroclipboard ดาวน์โหลดที่อยู่: //www.vevb.com/jiaoben/24961.html

Zeroclipboard ใช้ฟังก์ชั่นการคัดลอกไปยัง Pasteboard โดยเบราว์เซอร์หลายตัว (ปุ่มคัดลอกเดียวและปุ่มคัดลอกหลายปุ่ม) เพื่อให้ได้ประสบการณ์การใช้งานที่ดีขึ้นเว็บไซต์จำนวนมากตอนนี้จำเป็นต้องคลิกปุ่มคัดลอกเพื่อคัดลอกเนื้อหาไปยัง Pasteboard

ด้วยเหตุผลความเข้ากันได้นั้นจะเกิดขึ้นได้จาก Zeroclipboard ก่อนอื่นคุณต้องดาวน์โหลด Zeroclipboard หลังจากการบีบอัดให้ใส่ Zeroclipboard.js, Zeroclipboard.swf, Zeroclipboard10.swf ("สำหรับ Flash10") ลงในโครงการ SWF สามารถโหลดผ่าน Zeroclipboard.SetMoviePath ('/Zeroclipboard.swf');

ด้านล่างนี้เป็นรหัสที่แยกออก (แยกออกจากการค้นหาออนไลน์)

(ปุ่มคัดลอกเดียว):

html:

การคัดลอกรหัสมีดังนี้:

<input type = "text" value = "text" id = "copy_txt"/> <a href = "javascirc:;" id = "copy_btn"> คัดลอก </a>

<ภาษาสคริปต์ = "JavaScript">

Zeroclipboard.setMoviePath ('Zeroclipboard.swf'); // setMoviePath จะต้องตั้งค่าหากไม่ได้อยู่ในไดเรกทอรีเดียวกับ HTML

Zeroclipboard.setMoviePath ('Zeroclipboard10.swf');

var clip = new Zeroclipboard.client (); // สร้างวัตถุคลิปบอร์ดศูนย์ใหม่

clip.settext (''); // จะถูกตั้งค่าในภายหลังใน mousedown // ล้างคลิปบอร์ด

Clip.SethandCursor (จริง); // ตั้งค่ารูปร่างเมื่อเมาส์เลื่อนไปที่กล่องคัดลอก

clip.setcsseffects (จริง); // เปิดใช้งาน CSS

clip.addeventListener ('เสร็จสมบูรณ์', ฟังก์ชั่น (ไคลเอนต์, ข้อความ) {// ฟังเหตุการณ์หลังจากการคัดลอกเสร็จสิ้น

การแจ้งเตือน ("AA")

clip.hide (); // หลังจากคัดลอกหนึ่งครั้งซ่อน () ปุ่มคัดลอกไม่ทำให้การคำนวณซ้ำของจำนวนการใช้งานซ้ำ ๆ

-

clip.addeventListener ('mousedown', ฟังก์ชั่น (ไคลเอนต์) {

clip.settext (document.getElementById ('copy_txt'). ค่า);

-

clip.glue ('copy_btn');

</script>

ปุ่มสำเนาหลายปุ่ม:

การคัดลอกรหัสมีดังนี้:

<input type = "text" value = "text" id = "copy_txt0"/> <a href = "javascirct:;" id = "copy_btn0" data = '0'> คัดลอก </a>

<input type = "text" value = "text" id = "copy_txt1"/> <a href = "javascirct:;" id = "copy_btn1" data = '1'> คัดลอก </a>

<อินพุต type = "text" value = "text" id = "copy_txt2"/> <a href = "javascirct:;" id = "copy_btn2" data = '2'> คัดลอก </a>

<ภาษาสคริปต์ = "JavaScript">

$ (". copybtn"). แต่ละ (ฟังก์ชั่น (i) {

var id = $ (this) .attr ('data');

var clip = null;

clip = new Zeroclipboard.client ();

Zeroclipboard.setMoviePath ('Zeroclipboard.swf'); // setMoviePath จะต้องตั้งค่าหากไม่ได้อยู่ในไดเรกทอรีเดียวกับ HTML

Zeroclipboard.setMoviePath ('Zeroclipboard10.swf');

Clip.SethandCursor (จริง);

clip.settext ($ ("#copy_txt"+id) .val ());

clip.addeventListener ('เสร็จสมบูรณ์', ฟังก์ชั่น (ไคลเอนต์, ข้อความ) {

การแจ้งเตือน ("ขอแสดงความยินดีกับการคัดลอกที่ประสบความสำเร็จ");

-

clip.glue ('copy_btn'+id);

-

</script>

หมายเหตุ: clip.settext ($ ("#copy_txt"+id) .val ()); หากคุณจะได้รับเนื้อหาใน div คุณมักจะใช้ clip.settext ($ ("#copy_txt"+id) .Text ()); หรือ clip.settext ($ ("#copy_txt"+id) .html ());