execCommand全集

 

本爲copy至http://longtianyu1.blog.163.com/blog/static/998196520092155745419/

JavaScript中的execCommand介紹
 
execCommand方法是執行一個對當前文檔,當前選擇或者給出範圍的命令。處理Html數據時常用
如下格式:document.execCommand(sCommand[,交互方式, 動態參數]) ,其中:sCommand爲指令參數(如下例中的"2D-Position"),交互方式參數如果是true的話將顯示對話框,如果爲false的話,則不顯示對話框(下例中的"false"即表示不顯示對話框),動態參數一般爲一可用值或屬性值(如下例中的"true")。

document.execCommand("2D-Position","false","true");
下面列出的是指令參數及意義

 

2D-Position 允許通過拖曳移動絕對定位的對象。
AbsolutePosition 設定元素的 position 屬性爲“absolute”(絕對)。
BackColor 設置或獲取當前選中區的背景顏色。
BlockDirLTR 目前尚未支持。
BlockDirRTL 目前尚未支持。
Bold 切換當前選中區的粗體顯示與否。
BrowseMode 目前尚未支持。
Copy 將當前選中區複製到剪貼板。
CreateBookmark 創建一個書籤錨或獲取當前選中區或插入點的書籤錨的名稱。
CreateLink 在當前選中區上插入超級鏈接,或顯示一個對話框允許用戶指定要爲當前選中區插入的超級鏈接的 URL。
Cut 將當前選中區複製到剪貼板並刪除之。
Delete 刪除當前選中區。
DirLTR 目前尚未支持。
DirRTL 目前尚未支持。
EditMode 目前尚未支持。
FontName 設置或獲取當前選中區的字體。
FontSize 設置或獲取當前選中區的字體大小。
ForeColor 設置或獲取當前選中區的前景(文本)顏色。
FormatBlock 設置當前塊格式化標籤。
Indent 增加選中文本的縮進。
InlineDirLTR 目前尚未支持。
InlineDirRTL 目前尚未支持。
InsertButton 用按鈕控件覆蓋當前選中區。
InsertFieldset 用方框覆蓋當前選中區。
InsertHorizontalRule 用水平線覆蓋當前選中區。
InsertIFrame 用內嵌框架覆蓋當前選中區。
InsertImage 用圖像覆蓋當前選中區。
InsertInputButton 用按鈕控件覆蓋當前選中區。
InsertInputCheckbox 用複選框控件覆蓋當前選中區。
InsertInputFileUpload 用文件上載控件覆蓋當前選中區。
InsertInputHidden 插入隱藏控件覆蓋當前選中區。
InsertInputImage 用圖像控件覆蓋當前選中區。
InsertInputPassword 用密碼控件覆蓋當前選中區。
InsertInputRadio 用單選鈕控件覆蓋當前選中區。
InsertInputReset 用重置控件覆蓋當前選中區。
InsertInputSubmit 用提交控件覆蓋當前選中區。
InsertInputText 用文本控件覆蓋當前選中區。
InsertMarquee 用空字幕覆蓋當前選中區。
InsertOrderedList 切換當前選中區是編號列表還是常規格式化塊。
InsertParagraph 用換行覆蓋當前選中區。
InsertSelectDropdown 用下拉框控件覆蓋當前選中區。
InsertSelectListbox 用列表框控件覆蓋當前選中區。
InsertTextArea 用多行文本輸入控件覆蓋當前選中區。
InsertUnorderedList 切換當前選中區是項目符號列表還是常規格式化塊。
Italic 切換當前選中區斜體顯示與否。
JustifyCenter 將當前選中區在所在格式化塊置中。
JustifyFull 目前尚未支持。
JustifyLeft 將當前選中區所在格式化塊左對齊。
JustifyNone 目前尚未支持。
JustifyRight 將當前選中區所在格式化塊右對齊。
LiveResize 迫使 MSHTML 編輯器在縮放或移動過程中持續更新元素外觀,而不是隻在移動或縮放完成後更新。
MultipleSelection 允許當用戶按住 Shift 或 Ctrl 鍵時一次選中多於一個站點可選元素。
Open 目前尚未支持。
Outdent 減少選中區所在格式化塊的縮進。
OverWrite 切換文本狀態的插入和覆蓋。
Paste 用剪貼板內容覆蓋當前選中區。
PlayImage 目前尚未支持。
Print 打開打印對話框以便用戶可以打印當前頁。
Redo 目前尚未支持。
Refresh 刷新當前文檔。
RemoveFormat 從當前選中區中刪除格式化標籤。
RemoveParaFormat 目前尚未支持。
SaveAs 將當前 Web 頁面保存爲文件。
SelectAll 選中整個文檔。
SizeToControl 目前尚未支持。
SizeToControlHeight 目前尚未支持。
SizeToControlWidth 目前尚未支持。
Stop 目前尚未支持。
StopImage 目前尚未支持。
StrikeThrough 目前尚未支持。
Subs cript 目前尚未支持。
Supers cript 目前尚未支持。
UnBookmark 從當前選中區中刪除全部書籤。
Underline 切換當前選中區的下劃線顯示與否。
Undo 目前尚未支持。
Unlink 從當前選中區中刪除全部超級鏈接。
Unselect 清除當前選中區的選中狀態。

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JScript">
/*
*該function執行copy指令
*/
function fn_doufucopy() {
edit.select();
document.execCommand('Copy');
}
/*
*該function執行paste指令
*/
function fn_doufupaste() {
tt.focus();
document.execCommand('paste');
}
__>
</SCRIPT>
</head>
<body>
<input id=edit value=範例><br>
<button οnclick=fn_doufucopy()>Copy</button>
<button οnclick=fn_doufupaste()>paste</button><br>
<textarea id=tt rows=10 cols=50></textarea>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>execCommand整理</title>
<script language=javascript>
/*
   *該function用來創建一個超鏈接
   */
   function fn_creatlink()
   {
    document.execCommand('CreateLink',true,'true');//彈出一個對話框輸入URL
    //document.execCommand('CreateLink',false,'http://www.51js.com');
   }
/*
   *該function用來將選中的區塊設爲指定的背景色
   */
   function fn_change_backcolor()
   {
    document.execCommand('BackColor',true,'#FFbbDD');//true或false都可以
   }
/*
   *該function用來將選中的區塊設爲指定的前景色,改變選中區塊的字體大小,改變字體,字體變粗變斜
   */
function fn_change_forecolor()
{
   //指定前景色
   document.execCommand('ForeColor',false,'#BBDDCC');//true或false都可以
   //指定背景色
   document.execCommand('FontSize',false,7);     //true或false都可以
   //字體必須是系統支持的字體
   document.execCommand('FontName',false,'標楷體');    //true或false都可以
   //字體變粗
   document.execCommand('Bold');
   //變斜體
   document.execCommand('Italic');
}
/*
   *該function用來將選中的區塊加上不同的線條
   */
   function fn_change_selection()
   {
   //將選中的文字加下劃線
   document.execCommand('Underline');
   //在選中的文字上劃粗線
   document.execCommand('StrikeThrough');
   //將選中的部分文字變細
   document.execCommand('SuperScript');
   //將選中區塊的下劃線取消掉
   document.execCommand('Underline');
   }
   /*
    *該function用來將選中的區塊排成不同的格式
    */
   function fn_format()
   {
   //有序列排列
   document.execCommand('InsertOrderedList');
   //實心無序列排列
   document.execCommand('InsertUnorderedList');
   //空心無序列排列
   document.execCommand('Indent');
   }
/*
   *該function用來將選中的區塊剪下或是刪除掉
   */
function fn_CutOrDel()
{
   //刪除選中的區塊
   //document.execCommand('Delete');
   //剪下選中的區塊
   document.execCommand('Cut');
}
/*
   *該function用來將選中的區塊重設爲一個相應的物件
   */
function fn_InsObj()
{
   /*
    ******************************************
    * 以下指令都是爲選中的區塊重設一個object;
    *  如沒有特殊說明,第二個參數true或false是一樣的;
    *  參數三表示爲該object的id;
    *  可以用在javascript中通過其指定的id來控制它
    ******************************************
   */
   /*重設爲一個button(InsertButton和InsertInputButtong一樣,
  只不前者是button,後者是input)*/
   /*document.execCommand('InsertButton',false,"aa"); //true或false無效
   document.all.aa.value="風舞九天";*/
   //重設爲一個fieldset
   /*document.execCommand('InsertFieldSet',true,"aa");
   document.all.aa.innerText="刀劍如夢";*/
   //插入一個水平線
   //document.execCommand('InsertHorizontalRule',true,"aa");
   //插入一個iframe
   //document.execCommand('InsertIFrame',true,"aa");
   //插入一個InsertImage,設爲true時需要圖片,false時不需圖片
   //document.execCommand('InsertImage',false,"aa");
   //插入一個checkbox
   //document.execCommand('InsertInputCheckbox',true,"aa");
   //插入一個file類型的object
   //document.execCommand('InsertInputFileUpload',false,"aa");
   //插入一個hidden
   /*document.execCommand('InsertInputHidden',false,"aa");
   alert(document.all.aa.id);*/
   //插入一個InputImage
   /*document.execCommand('InsertInputImage',false,"aa");
   document.all.aa.src="F-a10.gif";*/
   //插入一個Password
   //document.execCommand('InsertInputPassword',true,"aa");
   //插入一個Radio
   //document.execCommand('InsertInputRadio',false,"aa");
   //插入一個Reset
   //document.execCommand('InsertInputReset',true,"aa");
   //插入一個Submit
   //document.execCommand('InsertInputSubmit',false,"aa");
   //插入一個input text
   //document.execCommand('InsertInputText',false,"aa");
   //插入一個textarea
   //document.execCommand('InsertTextArea',true,"aa");
   //插入一個 select list box
   //document.execCommand('InsertSelectListbox',false,"aa");
   //插入一個single select
   document.execCommand('InsertSelectDropdown',true,"aa");
   //插入一個line break(硬回車??)
   //document.execCommand('InsertParagraph');
   //插入一個marquee
   /*document.execCommand('InsertMarquee',true,"aa");
   document.all.aa.innerText="bbbbb";*/
   //用於取消選中的陰影部分
   //document.execCommand('Unselect');
   //選中頁面上的所有元素
   //document.execCommand('SelectAll');
}
/*
   *該function用來將頁面保存爲一個文件
   */
function fn_save()
{
   //第二個參數爲欲保存的文件名
   document.execCommand('SaveAs','mycodes.txt');
   //打印整個頁面
   //document.execCommand('print');
}
</script>
</head>
<body>
浮沉聚散變化又再,但是總可捲土重來.<br>
天若有情天亦老,人間正道是滄桑.<br>
都怪我,太執着,卻也等不到花開葉落.<br>
<input type=button value="創建CreateLink" οnclick=fn_creatlink()><br>
<input type=button value="改變文字背景色" οnclick=fn_change_backcolor()><br>
<input type=button value="改變文字前景色" οnclick=fn_change_forecolor()><br>
<input type=button value="給文字加線條" οnclick=fn_change_selection()><br>
<input type=button value="改變文字的排列" οnclick=fn_format()><br>
<input type=button value="刪除或剪下選中的部分" οnclick=fn_CutOrDel()><br>
<input type=button value="插入Object" οnclick=fn_InsObj()><br>
<input type=button value="保存或打印文件" οnclick=fn_save()><br>
<input type=button value="測試Refresh屬性" οnclick="document.execCommand('Refresh')">
</body>
</html>

普通的方式是激活一個<iframe>進入編輯狀態,命令如下

IframeNamer.document.designMode="On"

字體--宋體、黑體、楷體等

execCommand("fontname","",字體)

字號--字號大小

execCommand("fontsize","",字號)

加重

execCommand("Bold")

斜體

execCommand("Italic")

下劃線

execCommand("Underline")

刪除線

execCommand("StrikeThrough")

上標

execCommand("SuperScript")

下標

execCommand("SubScript")

有序排列--數字序號

execCommand("InsertOrderedList")

無序排列--圓點序號

execCommand("InsertUnorderedList")

向前縮進

execCommand("Outdent")

向後縮進

execCommand("Indent")

居左

execCommand("JustifyLeft")

居右

execCommand("JustifyRight")

居中

execCommand("JustifyCenter")

剪切

execCommand("Cut")

拷貝

execCommand("Copy")

粘貼

execCommand("Paste")

覆蓋

execCommand("Overwrite")

取消操作--IE5.0以後可以無限取消

execCommand("Undo")

重複操作

execCommand("Redo")

設置鏈接--若按以下寫法,在IE5.0版本中會激活一個內建窗口,可以完成輸入鏈接的功能,而且還可以選擇MAILTO、FTP等各種鏈接類型,比較方便

execCommand("CreateLink")

在IE4.0中,沒有內建鏈接輸入窗口,所以就需要用以下方式嵌入鏈接

execCommand("CreateLink","",TURL)

插入圖片--由於IE中嵌入的可編控件是針對本地資源的,所以其默認的圖片資源來自本地,所以基於WEB內容的編輯最好自己做輸入框,然後用如下命令實現。

execCommand("InsertImage","",ImgURL)

字體顏色

execCommand("ForeColor","",CColor)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章