File Under: JavaScript

JavaScript Event – Cut

This code was written based on a template by John Resig. The original can be found at John Resig’s addEvent function website.

The code, and the template, are referred to in Webmonkey’s JavaScript Events reference page. In this example, the onCut event fires whenever a form field’s contents are cut with the user’s local cut function (ctrl-x, edit menu, or contextual menu). The event can also be attached to the window object to catch cutting anywhere on the page.

The Code

<html>

<head>

<script>

// addEvent function by John Resig:

// http://ejohn.org/projects/flexible-javascript-events/

function addEvent( obj, type, fn ) {

  if ( obj.attachEvent ) {

    obj['e'+type+fn] = fn;

    obj[type+fn] = function(){obj['e'+type+fn]( window.event );}

    obj.attachEvent( 'on'+type, obj[type+fn] );

  } else

    obj.addEventListener( type, fn, false );

}

</script>

</head>

<body>



<!-- HTML for example event goes here -->

<input id="myinput" type="text" value="Cut this text" />



<script>

// Script for example event goes here

addEvent(document.getElementById('myinput'), 'cut', function(event) {

	var txtbox = event.target;

	var selectedText = txtbox.value.substr(txtbox.selectionStart, txtbox.selectionEnd - txtbox.selectionStart);

	alert('You cut some text: ' + selectedText);

});

</script>

</body>

</html>

What it Looks Like