Ajax[转]OBOUT ASP.NET HTML Editor – Insert HTML

本文转自: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();

                }

 

相关文章