| Server IP : 202.29.229.35 / Your IP : 18.188.0.144 Web Server : Apache System : Linux aapanel2 4.15.0-213-generic #224-Ubuntu SMP Mon Jun 19 13:30:12 UTC 2023 x86_64 User : www ( 1001) PHP Version : 5.5.38 Disable Function : passthru,exec,system,putenv,chroot,chgrp,chown,shell_exec,popen,proc_open,pcntl_exec,ini_alter,ini_restore,dl,openlog,syslog,readlink,symlink,popepassthru,pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,imap_open,apache_setenv MySQL : ON | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /www/wwwroot/www.ivecr2.ac.th/system_admin/ckeditor/samples/ |
Upload File : |
<!DOCTYPE html>
<!--
Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or http://ckeditor.com/license
-->
<html>
<head>
<meta charset="utf-8">
<title>API Usage — CKEditor Sample</title>
<script src="../ckeditor.js"></script>
<link href="sample.css" rel="stylesheet">
<script>
// The instanceReady event is fired, when an instance of CKEditor has finished
// its initialization.
CKEDITOR.on( 'instanceReady', function( ev ) {
// Show the editor name and description in the browser status bar.
document.getElementById( 'eMessage' ).innerHTML = 'Instance <code>' + ev.editor.name + '<\/code> loaded.';
// Show this sample buttons.
document.getElementById( 'eButtons' ).style.display = 'block';
});
function InsertHTML() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
var value = document.getElementById( 'htmlArea' ).value;
// Check the active editing mode.
if ( editor.mode == 'wysiwyg' )
{
// Insert HTML code.
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
editor.insertHtml( value );
}
else
alert( 'You must be in WYSIWYG mode!' );
}
function InsertText() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
var value = document.getElementById( 'txtArea' ).value;
// Check the active editing mode.
if ( editor.mode == 'wysiwyg' )
{
// Insert as plain text.
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertText
editor.insertText( value );
}
else
alert( 'You must be in WYSIWYG mode!' );
}
function SetContents() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
var value = document.getElementById( 'htmlArea' ).value;
// Set editor contents (replace current contents).
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setData
editor.setData( value );
}
function GetContents() {
// Get the editor instance that you want to interact with.
var editor = CKEDITOR.instances.editor1;
// Get editor contents
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-getData
alert( editor.getData() );
}
function ExecuteCommand( commandName ) {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
// Check the active editing mode.
if ( editor.mode == 'wysiwyg' )
{
// Execute the command.
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-execCommand
editor.execCommand( commandName );
}
else
alert( 'You must be in WYSIWYG mode!' );
}
function CheckDirty() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
// Checks whether the current editor contents present changes when compared
// to the contents loaded into the editor at startup
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-checkDirty
alert( editor.checkDirty() );
}
function ResetDirty() {
// Get the editor instance that we want to interact with.
var editor = CKEDITOR.instances.editor1;
// Resets the "dirty state" of the editor (see CheckDirty())
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-resetDirty
editor.resetDirty();
alert( 'The "IsDirty" status has been reset' );
}
function Focus() {
CKEDITOR.instances.editor1.focus();
}
function onFocus() {
document.getElementById( 'eMessage' ).innerHTML = '<b>' + this.name + ' is focused </b>';
}
function onBlur() {
document.getElementById( 'eMessage' ).innerHTML = this.name + ' lost focus';
}
</script>
</head>
<body>
<h1 class="samples">
<a href="index.html">CKEditor Samples</a> » Using CKEditor JavaScript API
</h1>
<div class="description">
<p>
This sample shows how to use the
<a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.editor">CKEditor JavaScript API</a>
to interact with the editor at runtime.
</p>
<p>
For details on how to create this setup check the source code of this sample page.
</p>
</div>
<!-- This <div> holds alert messages to be display in the sample page. -->
<div id="alerts">
<noscript>
<p>
<strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
support, like yours, you should still see the contents (HTML data) and you should
be able to edit it normally, without a rich editor interface.
</p>
</noscript>
</div>
<form action="../../../samples/sample_posteddata.php" method="post">
<textarea cols="100" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
<script>
// Replace the <textarea id="editor1"> with an CKEditor instance.
CKEDITOR.replace( 'editor1', {
on: {
focus: onFocus,
blur: onBlur,
// Check for availability of corresponding plugins.
pluginsLoaded: function( evt ) {
var doc = CKEDITOR.document, ed = evt.editor;
if ( !ed.getCommand( 'bold' ) )
doc.getById( 'exec-bold' ).hide();
if ( !ed.getCommand( 'link' ) )
doc.getById( 'exec-link' ).hide();
}
}
});
</script>
<p id="eMessage">
</p>
<div id="eButtons" style="display: none">
<input id="exec-bold" onclick="ExecuteCommand('bold');" type="button" value="Execute "bold" Command">
<input id="exec-link" onclick="ExecuteCommand('link');" type="button" value="Execute "link" Command">
<input onclick="Focus();" type="button" value="Focus">
<br><br>
<input onclick="InsertHTML();" type="button" value="Insert HTML">
<input onclick="SetContents();" type="button" value="Set Editor Contents">
<input onclick="GetContents();" type="button" value="Get Editor Contents (HTML)">
<br>
<textarea cols="100" id="htmlArea" rows="3"><h2>Test</h2><p>This is some <a href="/Test1.html">sample</a> HTML code.</p></textarea>
<br>
<br>
<input onclick="InsertText();" type="button" value="Insert Text">
<br>
<textarea cols="100" id="txtArea" rows="3"> First line with some leading whitespaces.
Second line of text preceded by two line breaks.</textarea>
<br>
<br>
<input onclick="CheckDirty();" type="button" value="checkDirty()">
<input onclick="ResetDirty();" type="button" value="resetDirty()">
</div>
</form>
<div id="footer">
<hr>
<p>
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
</p>
<p id="copy">
Copyright © 2003-2014, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
Knabben. All rights reserved.
</p>
</div>
</body>
</html>