Click to copy to clipboard jQuery

click to copy

Click to copy to clipboard jQuery:

jquery-clipboard-copy

 

 

If you look at the coupon websites, they will copy the coupon you clicked to your clipboard.

 

coupondunia-ebay-coupon-copied

 

 

Plugins Required for click to copy to clipboard:

1. jQuery Plugin [jquery.min.js]

2. zClip Plugin [jquery.zclip.js]

 

Click to Copy to clipboard jQuery source code:

[html]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Click To Copy | Javadomain.in</title>
<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript"
src="http://www.steamdev.com/zclip/js/jquery.zclip.js"></script>
<style type="text/css">
#javadomain {
/*style for flat textbox with border black*/
/* border: 1px solid #000000; */
/*style for flat textbox with border white*/
border: 1px solid white;
font-size: 15px;
height: 30px;
width: 100px;
}
</style>
<script>
$(document).ready(function() {
$("a#copy-javadomain").zclip({
path : "js/ZeroClipboard.swf",
copy : function() {
return $("input#javadomain").val();
}
});
});
</script>
</head>
<body>
<input type="text" id="javadomain" value="Javadomain.in" />
<a href="#" id="copy-javadomain">Click to Copy</a>
</body>
</html>

[/html]

 

Output:

click_to_copy_output

 

 

 

Before Copying to clipboard, if you want prompt need to be asked, then you can check the below code,

 

jQuery Copying to clipboard with promt source code:

[html]

<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
function copyToClipboard(text) {
window.prompt("Press Ctrl+C to copy to clipboard", text);
}
$(document).ready(function(){
$(‘#javadomain’).click(function() {
copyToClipboard($(‘#javadomain’).text());
});
});
</script>
</head>
<body>
<div id="javadomain">Welcome to Javadomain.in</div>
</body>
</html>

[/html]

 

 

Output:

 

click to copy prompt

 

 

Download Source Code:

jQuery Click To Copy – Prompt Source Code

 

 

jQuery Recommended Books:

 

 

 

Leave a Reply