javascript

Chapter 13: Scripting Forms
Clipboard data is accessible via the clipboardData object that exists either on the window object
(in IE) or on the event object (in Safari and Chrome); Firefox does not support the clipboardData
object. In Safari and Chrome, the clipboardData object is available only during clipboard events to
prevent unauthorized clipboard access; IE exposes the clipboardData object all the time. For cross -
browser compatibility, it ’ s best to use this object only during clipboard events.
There are three methods on the clipboardData object: getData() , setData() , and clearData() . The
getData() method retrieves string data from the clipboard and accepts a single argument, which is
the format for the data to retrieve. IE specifies two options: “ text ” and “ URL “ . Safari and Chrome
expect a MIME type, but will accept “ text ” as equivalent to “ text/plain ” .
The setData() method is similar: its first argument is the data type, and its second argument is the text
to place on the clipboard. Once again, IE supports “ text ” and “ URL ” whereas Safari and Chrome expect
a MIME type. Unlike getData() , however, Safari and Chrome won ’ t recognize the “ text ” type. Both
browsers return true if the text was placed onto the clipboard successfully, or false if not. To even out
the differences, the following cross - browser methods can be added to EventUtil :
var EventUtil = {
};
//more code here
getClipboardText: function(event){
var clipboardData = (event.clipboardData || window.clipboardData);
return clipboardData.getData(“text”);
},
//more code here
setClipboardText: function(event, value){
if (event.clipboardData){
return event.clipboardData.setData(“text/plain”, value);
} else if (window.clipboardData){
return window.clipboardData.setData(“text”, value);
}
},
//more code here
The getClipboardText() method is relatively simple. It needs only to identify the location of the
clipboardData object and then call getData() with a type of “ text ” . Its companion method,
setClipboardText() , is slightly more involved. Once the clipboardData object is located,
setData() is called with the appropriate type for each implementation ( “ text/plain ” for Safari and
Chrome; “ text ” for IE).
Reading text from the clipboard is helpful when you have a text box that expects only certain characters
or a certain format of text. For example, if a text box allows only numbers, then pasted values must also
be inspected to ensure that the value is valid. In the paste event, you can determine if the text on the
clipboard is invalid, and if so, cancel the default behavior as shown in the following example:
448