[转]OBOUT ASP.NET HTML Editor - Insert HTML

时间:2024-01-10 23:08:02

本文转自:http://www.obout.com/editor_new/sample_InsertHTML.aspx

Example demonstrates how to access HTML Editor's content at current selection/caret position from "outside" component.

Example code

<script type="text/JavaScript">
function Insert()
{
oboutGetEditor('editor').InsertHTML("<a href='mailto://support@obout.com'>Obout support</a>");
}
</script> <input type="button" onclick="Insert();" value="Insert Obout support link"/>
<ed:Editor id="editor" runat="server" />

具体实例效果见 http://www.obout.com/editor_new/sample_InsertHTML.aspx

另有:http://www.obout.com/Obout.Ajax.UI/HTMLEditor/examples/CSAPI_insertHTML.aspx

Obout.Ajax.UI Controls - HTML Editor - Insert HTML code in the current cursor position

<%@ Register Assembly="Obout.Ajax.UI" Namespace="Obout.Ajax.UI.HTMLEditor" TagPrefix="obout" %>
<input type="button" onclick="InsertLink();" value="Insert Obout support link"/>
<br /><br />
<obout:Editor runat="server" Id="editor" Width="100%" >
<TopToolbar PreservePlace="true" />
<EditPanel Height="400px" />
</obout:Editor>
...
<script type="text/javascript">
function InsertLink() {
// get the EditPanel
var editPanel = $find("<%= editor.ClientID %>").get_editPanel();
// can be inserted in 'Design' mode only
if (editPanel.get_activeMode() == Obout.Ajax.UI.HTMLEditor.ActiveModeType.Design) {
// save content for 'Undo' operation
editPanel.get_activePanel().SaveContent();
// insert HTML into current caret position
editPanel.get_activePanel().insertHTML("<a href='mailto://support@obout.com'>Obout support</a>");
}
}
</script>

具体实例效果见http://www.obout.com/Obout.Ajax.UI/HTMLEditor/examples/CSAPI_insertHTML.aspx

                var editPanel = Obout.Ajax.UI.HTMLEditor.LastFocusedEditPanel;
// if the current mode is 'Design'
if (editPanel != null && editPanel.get_activeMode() == Obout.Ajax.UI.HTMLEditor.ActiveModeType.Design) { alert(varHtmlContent); // get the DesignPanel's object var designPanel = editPanel.get_activePanel(); // For 'Undo' designPanel._saveContent(); // What to do - insert some text at current selection //--------------------------------------------------- designPanel.insertHTML("" + "$$" + varHtmlContent + "$$" + ""); //--------------------------------------------------- // Notify Editor about content changed and update toolbars linked to the edit panel // setTimeout(function () { designPanel.onContentChanged(); editPanel.updateToolbar(); }, 0); // Ensure focus in design panel designPanel.focusEditor(); }