mimetex + fckeditor

mayflowers posted @ 2008年6月27日 07:42 in Java , 2605 阅读

1、配置好mimetex.exe

2、下载 fckeditor 2.6，解压后，将解压出来的 fckeditor 文件夹 copy 到 webroot/ 下（里面其实有很多用不到的东西，可以删掉）。

3、下载 fckeditor.java 2.3，解压后把 FCKeditor-2.3.jar 复制到 webroot/WEB-INF/lib/ 下。fckeditor 2.6 默认支持很多语言（解压后可以看到很多不同后缀的文件：.php, .aspx, .pl 等等，但是没有 .jsp, .java）但不支持 jsp，而有了FCKeditor-2.3.jar ，就可以在 jsp 里用 fckeditor。

有意思的是我原本以为用 jsp 的话兼容性更好，因为是在服务器端初始化 fckeditor，但是在 safari 3.1.2 下却报错误：

org.apache.jasper.JasperException: java.lang.NumberFormatException: For input string: "version"......

而直接用 javascript 创建 fckeditor 却没有问题。

4、修改配置文件：

a、WebRoot/WEB-INF/web.xml

		<servlet>

		       <servlet-name>Connector</servlet-name>

		       <servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>

		       <init-param>

		           <param-name>baseDir</param-name>

		           <param-value>/UserFiles/</param-value>

		       </init-param>

		       <init-param>

		           <param-name>debug</param-name>

		           <param-value>true</param-value>

		       </init-param>

		       <load-on-startup>1</load-on-startup>

		   </servlet>

		   <servlet>

		       <servlet-name>SimpleUploader</servlet-name>

		       <servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>

		       <init-param>

		           <param-name>baseDir</param-name>

		           <param-value>/UserFiles/</param-value>

		       </init-param>

		       <init-param>

		           <param-name>debug</param-name>

		           <param-value>true</param-value>

		       </init-param>

		       <init-param>

		           <param-name>enabled</param-name>

		           <param-value>true</param-value>

		       </init-param>

		       <init-param>

		           <param-name>AllowedExtensionsFile</param-name>

		           <param-value></param-value>

		       </init-param>

		       <init-param>

		           <param-name>DeniedExtensionsFile</param-name>

		           <param-value>php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi</param-value>

		       </init-param>

		       <init-param>

		           <param-name>AllowedExtensionsImage</param-name>

		           <param-value>jpg|gif|jpeg|png|bmp</param-value>

		       </init-param>

		       <init-param>

		           <param-name>DeniedExtensionsImage</param-name>

		           <param-value></param-value>

		       </init-param>

		       <init-param>

		           <param-name>AllowedExtensionsFlash</param-name>

		           <param-value>swf|fla</param-value>

		       </init-param>

		       <init-param>

		           <param-name>DeniedExtensionsFlash</param-name>

		           <param-value></param-value>

		       </init-param>

		       <load-on-startup>1</load-on-startup>

		   </servlet>

		<servlet-mapping>

		    <servlet-name>Connector</servlet-name>

		    <url-pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>

		</servlet-mapping>

		<servlet-mapping>

		    <servlet-name>SimpleUploader</servlet-name>

		    <url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>

		</servlet-mapping>

b、WebRoot/fckeditor/fckconfig.js:

		FCKConfig.AutoDetectLanguage    = false ;

		FCKConfig.DefaultLanguage              = 'en' ;

并在 FCKConfig.ToolbarSets["Default"] 里加上 'Latex'

c、WebRoot/fckeditor/ lang/ en.js:

		Latex            : "Latex",

d、WebRoot/fckeditor/editor/js/ fckeditorcode_ie.js 和 fckeditorcode_gecko.js:

		var FCKCommands=FCK.Commands={};.......case 'Latex':B=new FCKDialogCommand('Latex',FCKLang.Latex,'dialog/fck_latex.html',380,210);break;......

		var FCKToolbarItems={}; ......case 'Latex':B=new FCKToolbarButton('Latex',FCKLang.Latex,null,FCK_TOOLBARITEM_ONLYTEXT,null,null,73);break;......

e、WebRoot/fckeditor/editor/dialog/ 下建立 fck_latex.html：

		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

		<html xmlns="http://www.w3.org/1999/xhtml">

		<head>

		        <title></title>

		        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		        <script src="common/fck_dialog_common.js" type="text/javascript"></script>

		        <script type="text/javascript">

		var dialog      = window.parent ;

		var oEditor = dialog.InnerDialogLoaded() ;

		window.onload = function ()

		{

		        // First of all, translate the dialog box texts

		        oEditor.FCKLanguageManager.TranslatePage(document) ;

		        dialog.SetAutoSize( true ) ;

		}

		function Insertformula()

		{

		        oEditor.FCKUndo.SaveUndoStep() ;

		        var url=document.getElementById("latex").value;

		        var oImg = oEditor.FCK.InsertElement('img') ;

		        oImg.src = "/cgi-bin/mimetex.exe?"+url ;

		        oImg.alt=url;

		        document.body.innerHTML = '' ;

		        dialog.Cancel() ;

		}

		function preview(){

		var tex=document.getElementById("latex").value;

		if(tex!=""){

		document.getElementById("result").innerHTML="<img src='/cgi-bin/mimetex.exe?"+tex+"' alt='"+tex+"'>";

		}

		}

		   </script>

		</head>

		<body style="overflow: hidden">

		<br/>

		<table cellpadding="2" cellspacing="2" align="center" border="0" width="100%" height="100%">

		<tr>

		<td>

		<div style="width:300px;" id="result">The Result for Preview</div>

		</td>

		</tr>

		<tr>

		<td> LaTeX: &nbsp;<input id="latex" type="text" style="width:250px;">

		</tr>

		<tr>

		<td>&nbsp; &nbsp; <input type=button onclick="Insertformula()" value="Insert">&nbsp; &nbsp;<input type=button value="Preview" onclick="preview()"> </td>

		</tr>

		</table>

		</body>

		</html>

5、测试：

新建 fckeditor.jsp:

		<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

		<%@ page language="java" import="com.fredck.FCKeditor.*"%>

		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

		<html>

		  <head>

		    <title>My JSP 'fckeditor.jsp' starting page</title>

		</head> 

		  <body>

		  <form action="fckeditor.test.jsp" method=post>

		<%

		//FCKeditor oFCKeditor;

		// 定义一个属性来使Action通过request来获得FCKeditor编辑器中的值

		 FCKeditor oFCKeditor = new FCKeditor(request, "content");

		 oFCKeditor.setBasePath("/fckeditor/");

		// 设置FCKeditor编辑器打开时的默认值

		 oFCKeditor.setValue("input your words");

		 out.println(oFCKeditor.create());//使用 safari 时会出错。

		%>

		<br>

		<input type=submit>

		</form>

		</body>

		</html>

[回复]

jnanabhumiap.in 说:
2024年1月09日 14:09

JNANABHUMI AP provides all latest educational updates and many more. The main concept or our aim behind this website has been the will to provide resources full information on each topic which can be accessed through Internet. To ensure that every readers get’s what important and worthy about the topic they search and link to hear from us. jnanabhumiap.in Jnanabhumi AP is a startup by passionate webmasters and bloggers who have passion to provide engaging content which is accurate, interesting and worthy to read. We are mope like a web community where you can find different information’s, resources, topics on day to day incidents or news. We provide you the finest of web content on each and every topics possible with help of editorial and content team.