How to detect copy, paste and cut behavior with jQuery

To detect copy, paste and cut behavior, you just need to bind the corresponding event type.

$("#textA").bind('copy', function() {
    $('span').text('copy behaviour detected!')
});	
$("#textA").bind('paste', function() {
    $('span').text('paste behaviour detected!')
});	
$("#textA").bind('cut', function() {
    $('span').text('cut behaviour detected!')
});

If you are using jQuery 1.4x, it’s support the multiple events declaration like following :

$("#textA").bind({
	copy : function(){
		$('span').text('copy behaviour detected!');
	},
	paste : function(){
		$('span').text('paste behaviour detected!');
	},
	cut : function(){
		$('span').text('cut behaviour detected!');
	}
});

Try it yourself

<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
 
<style type="text/css">
	span{
		color:blue;
	}
</style>
 
</head>
<body>
  <h1>jQuery copy, paste and cut example</h1>
  <form action="#">
  	<label>TextBox : </label>
	<input id="textA" type="text" size="50" 
          value="Copy, paste or cut message here" />
  </form>
 
  <span></span>
 
<script type="text/javascript">
 
$(document).ready(function() {
 
	$("#textA").bind({
		copy : function(){
			$('span').text('copy behaviour detected!');
		},
		paste : function(){
			$('span').text('paste behaviour detected!');
		},
		cut : function(){
			$('span').text('cut behaviour detected!');
		}
	});
 
});	
</script>
</body>
</html>
Tags :

About the Author

mkyong
Founder of Mkyong.com and HostingCompass.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments