<html>
<head>
<title>Rich Text Editing Example</title>
<script type="text/javascript" src="EventUtil.js"></script>
</head>
<body>
<form method="post" action="javascript:alert('Form submitted!')">
<div id="divSimple">
<input type="button" value="Bold" />
<input type="button" value="Italic" />
<input type="button" value="Underline" />
<input type="button" value="Indent" />
<input type="button" value="Outdent" />
<input type="button" value="Copy" />
<input type="button" value="Cut" />
<input type="button" value="Paste" />
</div>
<div id="divComplex">
<input type="button" value="Create Link" id="btnCreateLink" />
<input type="button" value="Change Font Size" id="btnChangeFontSize" />
<input type="button" value="Highlight Text" id="btnHighlight" />
<input type="button" value="Get HTML" id="btnGetHtml" />
<input type="button" value="Get Selected Text" id="btnGetSelected" />
</div>
<div id="divQuery">Is the current selection:
<input type="button" value="Bold" />
<input type="button" value="Italic" />
<input type="button" value="Underline" />
</div>
<iframe name="richedit" style="height: 100px; width: 300px" src="blank.htm"></iframe>
<input type="hidden" name="comments" value="" />
<input type="submit" value="Submit Form" />
</form>
<script type="text/javascript">
(function(){
EventUtil.addHandler(window, "load", function(){
frames["richedit"].document.designMode = "on";
});
var simple = document.getElementById("divSimple");
var complex = document.getElementById("divComplex");
var queryDiv = document.getElementById("divQuery");
EventUtil.addHandler(document.forms[0], "submit", function(){
event = EventUtil.getEvent(event);
var target = EventUtil.getTarget(event);
target.elements["comments"].value = frames["richedit"].document.body.innerHTML;
});
EventUtil.addHandler(simple, "click", function(event){
event = EventUtil.getEvent(event);
var target = EventUtil.getTarget(event);
if (target.type == "button"){
frames["richedit"].document.execCommand(target.value.toLowerCase(), false, null);
}
});
EventUtil.addHandler(complex, "click", function(event){
event = EventUtil.getEvent(event);
var target = EventUtil.getTarget(event);
switch(target.id){
case "btnGetHtml":
alert(frames["richedit"].document.body.innerHTML);
break;
case "btnCreateLink":
var link = prompt("What link?", "http://www.wrox.com");
if (link){
frames["richedit"].document.execCommand("createlink", false, link);
}
break;
case "btnChangeFontSize":
var size = prompt("What size? (1-7)", "7");
if (size){
frames["richedit"].document.execCommand("fontsize", false, parseInt(size,10));
}
break;
case "btnGetSelected":
if (frames["richedit"].getSelection){
alert(frames["richedit"].getSelection().toString());
} else if (frames["richedit"].document.selection){
alert(frames["richedit"].document.selection.createRange().text);
}
break;
case "btnHighlight":
if (frames["richedit"].getSelection){
var selection = frames["richedit"].getSelection();
//get the range representing the selection
var range = selection.getRangeAt(0);
//highlight the selected text
var span = frames["richedit"].document.createElement("span");
span.style.backgroundColor = "yellow";
range.surroundContents(span);
} else if (frames["richedit"].document.selection){
var range = frames["richedit"].document.selection.createRange();
range.pasteHTML("<span style=\"background-color:yellow\">" + range.htmlText + "</span>");
}
break;
}
});
EventUtil.addHandler(queryDiv, "click", function(event){
event = EventUtil.getEvent(event);
var target = EventUtil.getTarget(event);
if (target.type == "button"){
alert(frames["richedit"].document.queryCommandState(target.value.toLowerCase(), false, null));
}
});
})();
</script>
</body>
</html>
JavaScript高级教程第二版源代码 （615个子文件） 
stylesheet1.css 40B example.css 37B stylesheet2.css 24B
smile.gif 2KB smile.gif 2KB smile.gif 2KB RichTextEditingExample.htm 6KB CrossBrowserXPathExample2.htm 5KB CrossBrowserXPathExample.htm 5KB SelectboxExample4.htm 5KB ScrollDimensionsExample.htm 5KB XHRPostExample.htm 5KB FormSerializationExample.htm 4KB IEXsltExample5.htm 4KB DragAndDropExample4.htm 4KB IEXsltExample4.htm 4KB IEXsltExample3.htm 4KB IEXsltExample2.htm 4KB DOMRangeExample2.htm 3KB DOMStyleObjectExample.htm 3KB CrossBrowserXmlExample2.htm 3KB GetBoundingClientRectExample.htm 3KB DOMRangeExample.htm 3KB CrossBrowserXmlExample.htm 3KB DragAndDropExample3.htm 3KB SelectboxExample3.htm 3KB StorageEventExample.htm 3KB DragAndDropExample2.htm 3KB UserAgentDetectionExample.htm 2KB OffsetDimensionsExample.htm 2KB GlobalAndLocalStorageExample.htm 2KB IEXmlDomExample4.htm 2KB SetDragImageExample.htm 2KB XHRProgressEventExample.htm 2KB SelectboxExample6.htm 2KB XHRTimeoutExample.htm 2KB JSONExample3.htm 2KB SelectboxExample2.htm 2KB FormResetExample.htm 2KB SelectboxExample.htm 2KB DOMRangeExample3.htm 2KB FormFieldEventsExample.htm 2KB GlobalStorageExample.htm 2KB IEXmlDomExample3.htm 2KB FormSubmissionExample.htm 2KB LocalStorageExample.htm 2KB DropEffectAndEffectAllowedExample.htm 2KB XHRAlternateEventsExample.htm 2KB SessionStorageExample.htm 2KB XHRResponseHeadersExample.htm 2KB XHRRequestHeadersExample.htm 2KB ReadyStateChangeEventExample2.htm 2KB XHRErrorEventExample.htm 2KB TextboxTabForwardExample.htm 2KB JSONExample4.htm 2KB VideoPlayerExample.htm 2KB IEXsltExample.htm 2KB XHRLoadEventExample.htm 2KB IEXPathExample3.htm 2KB StringTypePatternMatchingExample.htm 2KB XHRAsyncExample.htm 2KB CanvasTextExample.htm 2KB DOMEventFlowExample.htm 2KB NodeIteratorExample2.htm 2KB PluginDetectionExample3.htm 2KB CrossBrowserXsltExample.htm 2KB ElementAttributesExample.htm 2KB XHRExample.htm 2KB ParasiticCombinationInheritanceExample.htm 2KB IEXPathExample.htm 2KB TouchEventsExample.htm 2KB LazyLoadingExample.htm 2KB TextboxPartialSelectionExample.htm 2KB TreeWalkerExample1.htm 2KB XMLConstructionExample3.htm 2KB SelectboxExample5.htm 2KB UserDataExample.htm 2KB CanvasTransformExample.htm 1KB CSSRulesExample2.htm 1KB IEXmlDomExample.htm 1KB DataTransferExample.htm 1KB TreeWalkerExample2.htm 1KB SimulateIEClickExample.htm 1KB InnerTextExample5.htm 1KB TextboxGetSelectedTextExample.htm 1KB ContextMenuEventExample.htm 1KB IEXmlDomExample2.htm 1KB CanvasSaveRestoreExample.htm 1KB CanvasPathExample.htm 1KB IEXPathExample2.htm 1KB GestureEventsExample.htm 1KB ModuleAugmentationPatternExample.htm 1KB NodeInsertionEventsExample.htm 1KB SimulateDOMKeyEventExample.htm 1KB NodeIteratorExample1.htm 1KB EventTargetExample2.htm 1KB CanvasClearRectExample.htm 1KB PageLoggingExample.htm 1KB SubCookiesExample.htm 1KB CapabilitiesDetectionExample.htm 1KB共 615 条
- 1
- 2
- 3
- 4
- 5
- 6
- 7
资源评论
