Jsp中使用FCKeditor上傳圖片_JSP教程

      編輯Tag賺U幣
      教程Tag:暫無Tag,歡迎添加,賺取U幣!

      推薦:如何通用數據庫jsp分頁查詢模塊
      這個功能一共創建了兩個javabean組件和一個jsp頁面顯示分頁頁面,第一個是處理以數據庫連接的javabean,第一個javabean是處理分頁查詢結果的代碼,第三個jsp是調用第二個javabean,顯示分頁查詢結果! //下面是連接mysql數據庫的一個javabean的代碼(可以更改

      FCKeditor功能還真是強大,但它好像對Jsp不大敏感,網上介紹的文章也少。趕上最近要研究用FCKeditor上傳圖片,剛發現了幾篇,加上自己的研究成果,趕快總結一下。


      先去下載一個FCKeditor,再下一個FCKeditor.java 2.3 (FCKeditot for java) 這個文件就是用來讓它支持JSP的,我找了FCKeditor的官網,不過下載地址好像不大好用,建議去http://sourceforge.net/下載。網上說還有一個東西要下,就是xalan.jar,xml.apache.org是它的網站。


      現在開始設置,先到tomcat->webapps里建立一個文件夾叫mysite。把FCKeditor里的/editor和fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml四個文件copy到mysite文件夾里,因為別的文件對我們來說沒有什么意義。再把FCKeditor.java 2.3中的web目錄下的WEB-INF目錄copy到mysite下(里面有commons-fileupload.jar, FCKeditor-2.3.jar,web.xml等幾個文件), 把其中的src目錄下的FCKeditor.tld文件copy到mysite/WEB-INF/下.這樣它才支持JSP。


      下面我們要對其中的一些文件進行修改:
      打開fckconfig.js 文件,修改 FCKConfig.DefaultLanguage = 'zh-cn' ;
      把FCKConfig.LinkBrowserURL等的值替換成以下內容:
      FCKConfig.LinkBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Connector=connectors/jsp/connector" ;

      FCKConfig.ImageBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector" ;

      FCKConfig.FlashBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector" ;

      FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File' ;

      FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;

      FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;


      打開WEB-INF下面的web.xml文件:
      把SimpleUploader中的配置屬性enabled定義為true(開啟文件上傳功能)
      添加標簽定義:
      <taglib>
      <taglib-uri>/mysite</taglib-uri>
      <taglib-location>/WEB-INF/FCKeditor.tld</taglib-location>
      </taglib>


      這樣文件就設置完了,這時建立一個jsp文件試試:
      <%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" import="java.util.*" import="java.text.*" errorPage="" %>
      <%@ page language="java" import="com.fredck.FCKeditor.*" %>
      <%@ taglib uri="/mysite" prefix="FCK" %>
      <script type="text/javascript" src="/mysite/fckeditor.js"></script>
      <form method="POST" action="Bs_Bulletin_save.jsp">
      <table width="100%" border="0" cellspacing="1" cellpadding="2">
        <tr>
      <td width="19%" bgcolor="#F0F0F0" height="25" align="right">標題:</td>
      <td width="81%" bgcolor="#F0F0F0"><INPUT TYPE="text" NAME="title" size="58"></td>
      </tr>
      <tr>
      <td width="19%" height="300" bgcolor="#F0F0F0">
      <div align="center">中文信息設置<BR><BR>
      <span style="color: #FF0000">支持html(圖片大小寬度不要超過170個象素)</span></div>
      </td>
      <td width="81%" bgcolor="#F0F0F0">
      <textarea name="content" cols="58" rows="15"></textarea>
      <script type="text/javascript">
      var oFCKeditor = new FCKeditor('content') ;
      oFCKeditor.BasePath = "/mysite/" ;
      oFCKeditor.Height = 400;
      oFCKeditor.ToolbarSet = "Default" ;
      oFCKeditor.ReplaceTextarea();
      </script>
      </td>
      </tr>
      <tr>
      <td width="19%" height="25" bgcolor="#F0F0F0">發布時間:</td>
      <td width="81%" bgcolor="#F0F0F0"><INPUT TYPE="text" NAME="datatimes" value="<%=time%>" size="58"></td>
      </tr>

      <tr>
      <td colspan="2" bgcolor="#F0F0F0">
      <div align="center"><input type="submit" value=" 添 加 " name="cmdok">&nbsp;<input type="reset" value=" 重 寫 " name="cmdcancel"></div></td>
      </tr>
      </table>
      </form>

      加紅字的部分,就是調用這個在線編輯器了。現在上傳的圖看一下,提示internal server error 500,還記得一開始時,我們提到的xalan.jar嗎,現在把xalan.jar放到lib文件夾里,關掉tomcat再重起一下,應該好用了……


      注意,如果想把這個控件融入你現有的web應用系統中,就不需要新建mysite了,你可以這樣做:


      1、把FCKeditor里的/editor和fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml四個文件直接copy到現有web應用的某個目錄下。


      2、把FCKeditor.java 2.3中WEB-INF目錄里的commons-fileupload.jar, FCKeditor-2.3.jar放在現有系統的lib目錄下。


      3、在現有系統的web.xml中加入FCKeditor.java 2.3中web.xml的配置信息,并添加標簽定義:
      <taglib>
      <taglib-uri>/mysite</taglib-uri>
      <taglib-location>/WEB-INF/FCKeditor.tld</taglib-location>
      </taglib>
      這里別忘了把SimpleUploader中的配置屬性enabled定義為true以開啟文件上傳功能!


      4、然后把FCKeditor.tld文件copy到現有系統的WEB-INF/下,這樣就可以了。當然,FCKeditor.tld的位置不是絕對的,你可以放在其它地方,只要在前面的標簽定義中指定相應的位置就行了。


      附:FCKeditor.java中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>false</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>false</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>2</load-on-startup>
      </servlet>
      <servlet-mapping>
      <servlet-name>Connector</servlet-name>
      <url-pattern>/webapp/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern><!--FCKeditor所在目錄,即/editor和fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml四個文件所在目錄 -->
      </servlet-mapping>

      <servlet-mapping>
      <servlet-name>SimpleUploader</servlet-name>
      <url-pattern>/webapp/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern><!--FCKeditor所在目錄 -->
      </servlet-mapping>

      <taglib>
      <taglib-uri>/home/project/law/FCKeditor</taglib-uri>
      <taglib-location>/WEB-INF/FCKeditor.tld</taglib-location><!--FCKeditor.tld路徑 -->
      </taglib>
       

       

      分享:jsp的分頁查詢的代碼(mysql數據庫)
      這個功能一共創建了兩個javabean組件和一個jsp頁面顯示分頁頁面,第一個是處理以數據庫連接的javabean,第一個javabean是處理分頁查詢結果的代碼,第三個jsp是調用第二個javabean,顯示分頁查詢結果! //下面是連接mysql數據庫的一個javabean的代碼: package

      來源:模板無憂//所屬分類:JSP教程/更新時間:2010-04-12
      相關JSP教程