[转]BX9054: 各浏览器对 document.execCommand 方法的首参数可选值范围存在差异
标准参考
无。
问题描述
execCommand 方法通常用于控制可编辑的 IFRAME 内容,制作富文本编辑器。 但他现在为止还是非标准的,方法的首参数 Commmands 的可选值由各个浏览器厂商制定,支持程度并不统一。
造成的影响
使用仅有某个浏览器支持的 Commmands 参数会造成其他浏览器运行时脚本出错,从而影响其他浏览器内正常脚本继续执行。
受影响的浏览器
所有浏览器 |
---|
问题分析
document.execCommand 方法提供了对浏览器内置命令调用的接口,他暂时不属于任何现行规范定义范围,由浏览器各自实现。
在现有 HTML5 规范草案中,已经加入对 execCommand 方法的描述,他被安置在 HTMLDocument 接口定义中。该方法执行参数:document.execCommand(commandId [, showUI [, value ] ] )
通常 document.execCommand 方法可以使脚本程序执行在当前选择或在当前插入符位置进行一系列操作。一般来说,这些命令主要都是是用来实现富文本编辑器的核心功能。
execCommand 方法的参数 commandId 可选值以及作用,在 HTML5 规范草案中有部分描述,并定义了核心的可选参数列表,以及最后说明的自定义其他参数 vendorID-customCommandID 可由厂商自行扩展。详细内容可以参考 :7.11 Editing APIs
另外在各浏览器对应的开发者站点 msdn.microsoft.com (MSDN)、developer.mozilla.org (Mozilla Developer Network)、developer.apple.com (Apple Developer)、dev.opera.com (Opera Developer Community) 中,MSDN 与 Mozilla Developer Network 均有详细的 execCommand 方法的首参数可选值描述,Opera Developer Community 有简要说明, Apple Developer 无任何可查资料。
其中详细内容可参考开发者站点:
MSDN:execCommand Method、Command Identifiers。
MDC:Rich-Text Editing in Mozilla。
dev.opera.com :Rich HTML editing in the browser: part 1、Rich HTML editing in the browser: part 2。
这里需要注意,由于 HTML5 规范草案与各浏览器具体开发文档中对,execCommand 方法的首形参数的形参名称规定不相同,为了避免混淆,本文以后均采用 sCommands 来表示。
MSDN MDC HTML5 草案中提出的全部 sCommands 参数,如下表:
MSDN | MDC | HTML5 草案 2 |
---|---|---|
2D-Position | ||
AbsolutePosition | ||
BackColor | backColor | |
BlockDirLTR1 | ||
BlockDirRTL1 | ||
Bold | bold | bold |
BrowseMode1 | ||
ClearAuthenticationCache | ||
contentReadOnly | ||
Copy | copy | |
CreateBookmark | ||
CreateLink | createLink | createLink |
Cut | cut | |
decreaseFontSize | ||
Delete | delete | delete |
DirLTR1 | ||
DirRTL1 | ||
EditMode1 | ||
FontName | fontName | |
FontSize | fontSize | |
ForeColor | foreColor | |
FormatBlock | formatBlock | formatBlock |
enableInlineTableEditing | ||
enableObjectResizing | ||
forwardDelete | ||
heading | ||
hiliteColor | ||
increaseFontSize | ||
Indent | indent | |
InlineDirLTR1 | ||
InlineDirRTL1 | ||
InsertButton | ||
InsertFieldset | ||
InsertIFrame | ||
InsertInputButton | ||
InsertInputCheckbox | ||
InsertInputFileUpload | ||
InsertInputHidden | ||
InsertInputImage | ||
InsertInputPassword | ||
InsertInputRadio | ||
InsertInputReset | ||
InsertInputSubmit | ||
InsertInputText | ||
InsertMarquee | ||
insertBrOnReturn | ||
InsertHorizontalRule | insertHorizontalRule | |
InsertImage | insertImage | insertImage |
insertHTML | insertHTML | |
insertLineBreak | ||
insertOrderedList | insertOrderedList | |
InsertUnorderedList | insertUnorderedList | insertUnorderedList |
InsertParagraph | insertParagraph | insertParagraph |
InsertSelectDropdown | ||
InsertSelectListbox | ||
InsertTextArea | ||
insertText | ||
Italic | italic | italic |
JustifyCenter | justifyCenter | |
JustifyLeft | justifyLeft | |
JustifyRight | justifyRight | |
JustifyFull1 | ||
JustifyNone1 | ||
LiveResize | ||
MultipleSelection | ||
Open1 | ||
OverWrite | ||
Outdent | outdent | |
Paste | paste | |
PlayImage1 | ||
Redo1 | redo | redo |
RemoveFormat | removeFormat | |
Refresh | ||
RemoveParaFormat1 | ||
SelectAll | selectAll | selectAll |
SaveAs | ||
SizeToControl1 | ||
SizeToControlHeight1 | ||
SizeToControlWidth1 | ||
Stop1 | ||
StopImage1 | ||
StrikeThrough1 | strikeThrough | |
Subscript1 | subscript | subscript |
Superscript1 | superscript | superscript |
UnBookmark | ||
Underline | underline | |
Undo | undo | undo |
Unlink | unlink | unlink |
useCSS | ||
Unselect | unselect | |
styleWithCSS |
【注1】:MSDN 中标注为不支持的 sCommands 参数。
【注2】:仅为文章写作时期 HTML5 草案中存在的 sCommands 参数,不含说明中由厂商具体指定部分。
将所有 sCommands 参数汇集起来,构建测试用例,检查他们被支持程度。由于本例代码较多,故不在文中贴出,您可以直接观看下方的 测试页面。
根据测试页,得出实际 sCommands 可选参数支持度对照表:
sCommands | IE6 | IE7 | IE8 | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|---|---|---|
2D-Position | Y | Y | Y | N | N | N | N |
absolutePosition | Y | Y | Y | N | N | N | N |
backColor | Y | Y | Y | Y | Y | Y | Y |
blockDirLTR | Y | Y | Y | N | N | N | N |
blockDirRTL | Y | Y | Y | N | N | N | N |
bold | Y | Y | Y | Y | Y | Y | Y |
browseMode | Y | Y | Y | N | N | N | N |
clearAuthenticationCache | Y | Y | Y | N | N | N | N |
contentReadOnly | N | N | N | Y | N | N | Y |
copy | Y | Y | Y | N | N | N | N |
createBookmark | Y | Y | Y | N | N | N | N |
createLink | Y | Y | Y | Y | Y | Y | Y |
cut | Y | Y | Y | N | N | N | N |
decreaseFontSize | N | N | N | Y | N | N | Y |
delete | Y | Y | Y | Y | Y | Y | Y |
dirLTR | Y | Y | Y | N | N | N | N |
dirRTL | Y | Y | Y | N | N | N | N |
editMode | Y | Y | Y | N | N | N | N |
fontName | Y | Y | Y | Y | Y | Y | Y |
fontSize | Y | Y | Y | Y | Y | Y | Y |
foreColor | Y | Y | Y | Y | Y | Y | Y |
formatBlock1 | Y | Y | Y | Y | Y | Y | Y |
enableInlineTableEditing | N | N | N | Y | N | N | N |
enableObjectResizing | N | N | N | Y | N | N | N |
forwardDelete | N | N | N | N | Y | Y | N |
heading | N | N | N | Y | N | N | N |
increaseFontSize | N | N | N | Y | N | N | Y |
indent | Y | Y | Y | Y | Y | Y | Y |
inlineDirLTR | N | N | N | N | N | N | N |
inlineDirRTL | N | N | N | N | N | N | N |
insertButton | Y | Y | Y | N | N | N | N |
insertFieldset | Y | Y | Y | N | N | N | N |
insertIFrame | Y | Y | Y | N | N | N | N |
insertInputButton | Y | Y | Y | N | N | N | N |
insertInputCheckbox | Y | Y | Y | N | N | N | N |
insertInputFileUpload | Y | Y | Y | N | N | N | N |
insertInputHidden | Y | Y | Y | N | N | N | N |
insertInputImage | Y | Y | Y | N | N | N | N |
insertInputPassword | Y | Y | Y | N | N | N | N |
insertInputRadio | Y | Y | Y | N | N | N | N |
insertInputReset | Y | Y | Y | N | N | N | N |
insertInputSubmit | Y | Y | Y | N | N | N | N |
insertInputText | Y | Y | Y | N | N | N | N |
insertMarquee | Y | Y | Y | N | N | N | N |
insertBrOnReturn | N | N | N | Y | N | N | N |
insertHorizontalRule | Y | Y | Y | Y | Y | Y | Y |
insertImage | Y | Y | Y | Y | Y | Y | Y |
insertHTML | N | N | N | Y | Y | Y | Y |
insertLineBreak | N | N | N | N | Y | Y | N |
insertOrderedList | Y | Y | Y | Y | Y | Y | Y |
insertUnorderedList | Y | Y | Y | Y | Y | Y | Y |
insertParagraph | Y | Y | Y | Y | Y | Y | Y |
insertSelectDropdown | Y | Y | Y | N | N | N | N |
insertSelectListbox | Y | Y | Y | N | N | N | N |
insertTextArea | Y | Y | Y | N | N | N | N |
insertText | N | N | N | N | Y | Y | N |
italic | Y | Y | Y | Y | Y | Y | Y |
justifyCenter | Y | Y | Y | Y | Y | Y | Y |
justifyLeft | Y | Y | Y | Y | Y | Y | Y |
justifyRight | Y | Y | Y | Y | Y | Y | Y |
justifyFull | Y | Y | Y | Y | Y | Y | Y |
justifyNone | Y | Y | Y | N | Y | Y | N |
liveResize | Y | Y | Y | N | N | N | N |
multipleSelection1 | Y | Y | Y | N | N | N | N |
open | Y | Y | Y | N | N | N | N |
overWrite | Y | Y | Y | N | N | N | N |
outdent | Y | Y | Y | Y | Y | Y | Y |
paste | Y | Y | Y | N | N | N | N |
playImage | N | N | N | N | N | N | N |
Y | Y | Y | N | Y | Y | N | |
redo | Y | Y | Y | Y | N | N | Y |
removeFormat | Y | Y | Y | Y | Y | Y | Y |
refresh | Y | Y | Y | N | N | N | N |
removeParaFormat | N | N | N | N | N | N | N |
selectAll | Y | Y | Y | Y | Y | Y | Y |
saveAs | Y | Y | Y | N | N | N | N |
sizeToControl | N | N | N | N | N | N | N |
sizeToControlHeight | N | N | N | N | N | N | N |
sizeToControlWidth | Y | N | Y | N | N | N | N |
stop | Y | Y | Y | N | N | N | N |
stopImage | N | N | N | N | N | N | N |
strikeThrough | Y | Y | Y | Y | Y | Y | Y |
subscript | Y | Y | Y | Y | Y | Y | Y |
superscript | Y | Y | Y | Y | Y | Y | Y |
unBookmark | Y | Y | Y | N | N | N | N |
underline | Y | Y | Y | Y | Y | Y | Y |
undo | Y | Y | Y | Y | N | N | Y |
unlink | Y | Y | Y | Y | Y | Y | Y |
useCSS | N | N | N | Y | N | N | Y |
hiliteColor | N | N | N | Y | Y | Y | Y |
unselect | Y | Y | Y | N | Y | Y | Y |
styleWithCSS | N | N | N | Y | N | N | Y |
【注】:formatBlock 指令可接收的 vValue 值不同,IE 中需要 vValue 值为目标块标记名,而其他浏览器可以接收空字符串。
multipleSelection 指令在 Windows XP sp3 中可构建出多选列表,Windows 7 中指令只会返回 TRUE,对代码结构不会有任何改变。
解决方案
在调用 execCommand 方法时建议仅从 "backColor" "bold" "createLink" "delete" "fontSize" "foreColor" "formatBlock" "indent" "insertHorizontalRule" "insertImage" "insertOrderedList" "insertUnorderedList" "insertParagraph" "italic" "justifyCenter" "justifyLeft" "justifyRight" "justifyFull" "outdent" "removeFormat" "selectAll" "strikeThrough" "subscript" "superscript" "underline" "unlink" 参数中选择其一作为首参数传入,他们均被所有浏览器支持。
参见
知识库
相关问题
测试环境
操作系统版本: | Windows 7 Ultimate build 7600 |
---|---|
浏览器版本: | IE6 IE7 IE8 Firefox 3.6.10 Chrome 8.0.552.0 dev Safari 5.0.2 Opera 10.63 |
测试页面: | execCommand_sCommands_Parameters.html |
本文更新时间: | 2010-10-15 |
关键字
document execCommand Commands Identifiers HTML5 MSDN MDC
原文:
http://w3help.org/zh-cn/causes/BX9054 (需要FQ)
[转]BX9054: 各浏览器对 document.execCommand 方法的首参数可选值范围存在差异的更多相关文章
- document.execCommand 常用的方法
execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用如下格式: document.execCommand(sCommand[,交互方式, 动态参数]) , ...
- JS execCommand 方法
document.execCommand()方法处理Html数据时常用语法格式如下: 复制内容到剪贴板 代码: document.execCommand(sCommand[,交互方式, 动态参数]) ...
- Javascript中document.execCommand()的用法
document.execCommand()方法处理Html数据时常用语法格式如下:document.execCommand(sCommand[,交互方式, 动态参数]) 其中:sCommand为指令 ...
- javascript的document.execCommand(转)
document.execCommand()方法处理html数据时常用语法格式如下: 代码: document.execCommand(sCommand[,交互方式, 动态参数]) 其 中:sComm ...
- document.execCommand()函数可用参数解析
隐藏在暗处的方法-execCommand() 关键字: javascript document document.execCommand()方法可用来执行很多我们无法实现的操作. execComman ...
- JS 的execCommand 方法 做的一个简单富文本
execCommand 当一个 HTML 文档切换到设计模式(designMode)时,文档对象暴露 execCommand 方法,该方法允许运行命令来操纵可编辑区域的内容.大多数命令影响文档的选择( ...
- JS开发备忘笔记-- Javascript中document.execCommand()的用法
document.execCommand()方法处理Html数据时常用语法格式如下:document.execCommand(sCommand[,交互方式, 动态参数]) 其中:sCommand为指令 ...
- document.execCommand()的用法小记
项目中遇到金额输入框限制只能输入数字,输入特殊字符或者字母汉字时间隔不到1秒内容就会自动清空.跟正则纠缠多年的我初次见到,很是神奇-.- 代码实现: <input type="text ...
- JavaScript:document.execCommand()的用法
document.execCommand()的用法小记 一.语法 execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用. 如下格式:document.ex ...
随机推荐
- 使用Chrome(PC)调试移动设备上的网页
最早开始调试移动端网页时,本人都是采取PC上改几行代码,手机上刷新一下看效果这种笨方法来开发的,效率低而且容易让人抓狂.最近偶然发现原来可以使用PC上的浏览器来调试移动设备,不由得感叹相逢恨晚. 工具 ...
- uboot之bootm以及go命令的实现
本文档简单介绍了uboot中用于引导内核的命令bootm的实现,同时分析了uImage文件的格式,还简单看了一下uboot下go命令的实现 作者: 彭东林 邮箱: pengdonglin137@163 ...
- 如何将linux服务器作为文件服务器
在开发过程中想要使用linux服务器作为文件服务器,可以通过 IP+文件名来获取文件信息,比如http://localhost/banner/a.jpg.设置过程如下 1.安装apache2 sudo ...
- JavaScript之this的工作原理
JavaScript 有一套完全不同于其它语言的对 this 的处理机制. 在五种不同的情况下 ,this 指向的各不相同. 1.全局范围内 当在全部范围内使用 this,它将会指向全局对象. 2.函 ...
- Oracle -- Create User
CREATE USER hibernate IDENTIFIED BY "123" DEFAULT TABLESPACE "HIBERNATE" TEMPORA ...
- Mac 下 Git 的基础命令行操作
Mac 下 Git 的基础命令行操作 sudo apt-get install git-core //安装Git 用户配置 git config --global user.name "Yo ...
- Java 基础系列之volatile变量(一)
一.锁 两种特性:互斥性(mutual exclusion).可见性(visibility).原子性(atomic) 互斥性就是一次只有一个线程可以访问该共享数据,可见性就是释放锁之前,对共享数据的修 ...
- 【BZOJ1222】[HNOI2001]产品加工 DP
[BZOJ1222][HNOI2001]产品加工 Description 某加工厂有A.B两台机器,来加工的产品可以由其中任何一台机器完成,或者两台机器共同完成.由于受到机器性能和产品特性的限制,不同 ...
- ridge regression 无惩罚,导致预测结果空间过大而无实用价值
[ biased regression methods to reduce variance---通过偏回归来减小方差] https://onlinecourses.science.psu.edu/s ...
- 在linux通过源码编译安装redis详细步骤
1.下载源码包 [root@localhost opt]# wget http://download.redis.io/releases/redis-4.0.10.tar.gz 2.解压缩redis ...