Usage of Document.execcommand () in "JavaScript" javascript

Usage of Document.execcommand () in JavaScript

Combined reprint:

Reprint Source 1 Reprint Source 2

The Document.execcommand () method handles HTML data often in the following syntax format:
Document.execcommand (scommand[, interactive mode, dynamic parameter])

Where: Scommand is the instruction parameter ("2d-position" in the following example), if the interactive mode parameter is true, the dialog box is displayed, if False, the dialog box is not displayed ("false" in the following example means that the dialog box is not displayed). A dynamic parameter is generally an available value or a property value ("True" in the following example).

Document.execcommand ("2d-position", "false", "true");

Calling ExecCommand () can implement many features of the browser menu. such as saving a file, opening a new file, undoing, redo ... Wait a minute. With this method, you can easily implement a text editor in a Web page.

If used flexibly, we can assist us to complete various projects.

Examples of use are as follows:

1. Implementation of the Select All command
[Format]:d ocument.execcommand ("SelectAll")
[description] will be the selection of all the contents of the page!
[For example] to add between:
Select All

2. Implementation of the Open command
[Format]:d Ocument.execcommand ("open")
[note] This is similar to the commands in the WebBrowser control in programming design such as VB, we can also follow this to ponder.
[For example] to add between:
Open it

3. Implementation of the Save As command
[Format]:d ocument.execcommand ("SaveAs")
[Note] Save this page to another directory on this site!
[For example] to add between:
Save As

4, the implementation of the Print command
[Format]:d ocument.execcommand ("print")
[Description] Of course, you have to install a printer!
[For example] to add between:
Print

JS code is listed below the directive parameters and meaning

Equivalent to clicking the Open button in a file
Document.execcommand ("Open");

Save the current page as
Document.execcommand ("SaveAs");

Clip the selected text to the Clipboard;
Document.execcommand ("Cut", "false", NULL);

Delete the selected text;
Document.execcommand ("Delete", "false", NULL);

Changes the font of the selected area;
Document.execcommand ("FontName", "false", sfontname);

Change the font size of the selected area;
Document.execcommand ("FontSize", "false", ssize|isize);

Set the foreground color;
Document.execcommand ("ForeColor", "false", scolor);

So that the absolutely positioned objects can be dragged directly;
Document.execcommand ("2d-position", "false", "true");

Make the object positioning into absolute positioning;
Document.execcommand ("AbsolutePosition", "false", "true");

Set the background color;
Document.execcommand ("BackColor", "false", scolor);

Make the text in the selected area bold;
Document.execcommand ("Bold", "false", NULL);

Copy the selected text to the Clipboard;
Document.execcommand ("Copy", "false", NULL);

Sets the specified anchor point as a bookmark;
Document.execcommand ("CreateBookMark", "false", sanchorname);

Changes the selected text to a hyperlink, and if the second argument is true, the Parameter Settings dialog box appears;
Document.execcommand ("Createlink", "false", slinkurl);

Sets the label name of the current block;
Document.execcommand ("Formatblock", "false", stagname);

Equivalent to clicking the Open button in a file
Document.execcommand ("Open");

Save the current page as
Document.execcommand ("SaveAs");

Clip the selected text to the Clipboard;
Document.execcommand ("Cut", "false", NULL);

Delete the selected text;
Document.execcommand ("Delete", "false", NULL);

Changes the font of the selected area;
Document.execcommand ("FontName", "false", sfontname);

Change the font size of the selected area;
Document.execcommand ("FontSize", "false", ssize|isize);

Set the foreground color;
Document.execcommand ("ForeColor", "false", scolor);

So that the absolutely positioned objects can be dragged directly;
Document.execcommand ("2d-position", "false", "true");

Make the object positioning into absolute positioning;
Document.execcommand ("AbsolutePosition", "false", "true");

Set the background color;
Document.execcommand ("BackColor", "false", scolor);

Make the text in the selected area bold;
Document.execcommand ("Bold", "false", NULL);

Copy the selected text to the Clipboard;
Document.execcommand ("Copy", "false", NULL);

Sets the specified anchor point as a bookmark;
Document.execcommand ("CreateBookMark", "false", sanchorname);

Changes the selected text to a hyperlink, and if the second argument is true, the Parameter Settings dialog box appears;
Document.execcommand ("Createlink", "false", slinkurl);

Sets the label name of the current block;
Document.execcommand ("Formatblock", "false", stagname);

Document Object ExecCommand is often useful when working with HTML data online in IE, which allows you to easily implement a series of commands such as bold, color, and font text.

D-position allows an absolutely positioned object to be moved by dragging.
AbsolutePosition the Position property of the Set element is "absolute" (absolute).
BackColor Sets or gets the background color of the currently selected area.
BLOCKDIRLTR is not currently supported.
BLOCKDIRRTL is not currently supported.
Bold toggles whether the current selection is displayed in bold or not.
Browsemode is not currently supported.
Copy copies the currently selected area to the Clipboard.
CreateBookMark creates a bookmark anchor or gets the name of the bookmark anchor for the current selection or insertion point.
Createlink inserts a hyperlink on the current selection, or displays a dialog box that allows the user to specify the URL of the hyperlink to be inserted for the current selection.
Cut copies the currently selected area to the Clipboard and deletes it.
Delete Deletes the currently selected area.
DIRLTR is not currently supported.
DIRRTL is not currently supported.
EditMode is not currently supported.
FontName Sets or gets the font for the currently selected area.
FontSize Sets or gets the font size for the current selection.
ForeColor Sets or gets the foreground (text) color of the currently selected area.
Formatblock sets the current block formatting label.
Indent increases the indentation of the selected text.
INLINEDIRLTR is not currently supported.
INLINEDIRRTL is not currently supported.
Insertbutton overrides the current selection with a button control.
InsertFieldSet overwrites the current selection with a box.
Inserthorizontalrule overwrites the current selection with a horizontal line.
Insertiframe overwrites the current selection with an inline frame.
Insertimage overwrites the current selection with an image.
Insertinputbutton overrides the current selection with a button control.
Insertinputcheckbox overwrites the current selection with a check box control.
Insertinputfileupload overwrites the current selection with a file upload control.
Insertinputhidden inserts a hidden control that overrides the current selection.
Insertinputimage overwrites the current selection with an image control.
Insertinputpassword overwrites the current selection with a password control.
Insertinputradio overwrites the current selection with the radio button control.
Insertinputreset overrides the current selection with a reset control.
Insertinputsubmit overwrites the current selection with a Submit control.
Insertinputtext overwrites the current selection with a text control.
Insertmarquee overwrites the current selection with an empty caption.
Insertorderedlist Toggles whether the current selection is a numbered list or a regular formatting block.
InsertParagraph overwrites the currently selected area with a newline.
Insertselectdropdown overwrites the current selection with a drop-down box control.
Insertselectlistbox overwrites the current selection with a ListBox control.
Inserttextarea overwrites the current selection with the multiline text input control.
Insertunorderedlist Toggles whether the current selection is a bulleted list or a regular formatting block.
Italic Toggle the current selection italic display or not.
Justifycenter the current selection in the formatted block.
Justifyfull is not currently supported.
Justifyleft aligns the formatting blocks in the current selection to the left.
Justifynone is not currently supported.
Justifyright Right aligns the formatting blocks in the current selection.
Liveresize forces the MSHTML editor to continuously update the appearance of elements while zooming or moving, rather than just updating after the move or zoom is complete.
Multipleselection allows more than one site-selectable element to be selected at a time when the user holds down the shift or Ctrl key.
Open is not currently supported.
Outdent reduces the indentation of the formatting block where the selection is located.
OverWrite toggles the insertion and overwriting of text states.
Paste overwrites the current selection with the Clipboard contents.
Playimage is not currently supported.
Print opens the Printing dialog box so that the user can print the current page.
Redo is not currently supported.
Refresh refreshes the current document.
Removeformat removes the formatted label from the current selection.
Removeparaformat is not currently supported.
SaveAs saves the current Web page as a file.
SelectAll Select the entire document.
SizeToControl is not currently supported.
SizeToControlHeight is not currently supported.
SizeToControlWidth is not currently supported.
Stop is not currently supported.
Stopimage is not currently supported.
Strikethrough is not currently supported.
Subscript is not currently supported.
Superscript is not currently supported.
Unbookmark removes all bookmarks from the current selection.
Underline toggles whether the underline of the current selection is displayed or not.
Undo is not currently supported.
Unlink removes all hyperlinks from the currently selected area.
Unselect clears the selected state of the current selection.

About Document.execcommand:
To execute an edit command, call Document.execcommand and pass a string corresponding to the command ID. There is also an optional second parameter that specifies whether the user interface for this command is displayed if it can be applied. Passing the integer 1 will display the user interface, and integer 0 will skip it. This parameter is not typically used for editing commands. Because the default value is 0, if you do not use the third parameter (in this case, you must also pass a value for the second parameter), you can generally ignore it. The third parameter is also optional and, where applicable, it is used to pass any required parameters to the command.

The Pixy method is affected by the IE cache bug. In fact, this problem is not clear, but in fact, the bug is conditional, ie, the cache is set to every visit to the page, rather than the default automatically. Basically, only the developer will set the cache to check for updates every time, so this bug does not really affect the real user (according to the test under winxpsp2 IE6, although it may still invoke a network access API, but the actual request does not occur, The symptom is that the mouse has a very short time jitter, but the image does not blink. In addition, someone found an undisclosed way to allow IE to cache the background map:
Document.execcommand ("Backgroundimagecache", False,true)

This method even avoids the API call, which seems to be directly cached in IE memory.

IE6 set the background image is not real cache live, even if the server did the cache, if you want to cache live only ~ ~ ~

People who have done UI design and development must know that IE (not including IE7) will often reload the background image from the server side, and that the UI interface is so frustrating in IE (not including IE7) ...

Erik found a simple solution (for IE7 under the effective, in fact, in IE7 has fixed this bug)
Program Code Program code

Document.execcommand ("Backgroundimagecache", false, true);


Read ext source code today found that Jack Slocum has taken this into account, in Ext.js gave his implementation, in other AJAX framework should not have this similar code, from this detail can see the full of ext ~
Program Code Program code

var Isie = Ua.indexof ("MSIE") >-1, isIE7 = Ua.indexof ("MSIE 7″) >-1;
Remove CSS Image flicker
if (Isie &&!isie7) {
try{
Document.execcommand ("Backgroundimagecache", false, true);
}catch (e) {}
}


Today read the magic of the Dreamplayer player source code found that magic is also for the background of IE cache has been repaired, but he did not consider the IE7 has not existed in this phenomenon, which is evml.js in a section of the relevant code ~ (by the way muttered two: This guy, write JS never add a semicolon, Previously, this is still the case, so how to compress it, sweat ~ The following code according to my habits have been added semicolon, even if only two or three words ~)
Program Code Program code

Windows.isie=navigator.appname.indexof ("Microsoft") ==0;
if (Isie) {
Document.documentElement.addBehavior ("#default #userdata");
Document.execcommand ("Backgroundimagecache", false,true);

Example 1:
isNaN is whether the test is numeric, limit input to only numeric values such as: 1981.121, allow up to one decimal point

<input type= "text" name= "text" onkeyup= "if (IsNaN (value)) ExecCommand (' Undo ')"/>

Example 2:

<input Type=button value= cut Onclick=document.execcommand (' cut ') >
<input Type=button value= copy onclick=document.execcommand (' Copy ') >
<input Type=button value= paste onclick=document.execcommand (' Paste ') >
<input Type=button value= undo Onclick=document.execcommand (' Undo ') >
<input Type=button value= Redo Onclick=document.execcommand (' Redo ') Id=button2 name=button2>
<input>
<input Type=button value= Delete onclick=document.execcommand (' delete ') >
<input Type=button value= blackbody onclick=document.execcommand (' bold ') >
<input Type=button value= Italic onclick=document.execcommand (' Italic ') >
<input Type=button value= underline onclick=document.execcommand (' underline ') >
<input Type=button value= Stop Onclick=document.execcommand (' Stop ') >
<input Type=button value= Save Onclick=document.execcommand (' SaveAs ') >
<input Type=button value= Save As Onclick=document.execcommand (' Saveas ', false, ' c:\\test.htm ') >
<input Type=button value= Font onclick=document.execcommand (' FontName ', FALSE,FN) >
<input Type=button value= Font size onclick=document.execcommand (' FontSize ', false,fs) >
<input Type=button value= Refresh Onclick=document.execcommand (' Refresh ', false,0) >

Usage of Document.execcommand () in "JavaScript" javascript