ckeditor環境搭建 ，請參考 JSP中使用CKEditor3.6入門教程
JSP頁面使用富文本控制項ckeditor提交表單資料
JSP頁面使用富文本控制項ckeditor自訂樣式
JSP使用ckeditor和ckfinder實現富文本及上傳功能
表單頁面代碼如下：
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><script type="text/javascript"src="<%=request.getContextPath()%>/ckeditor/ckeditor.js"></script><script type="text/javascript">//<![CDATA[ CKEDITOR.replace('content', {toolbar : 'Full',skin : 'kama'});//]]> function test() {//JavaScript判空，如果確定var editor_data = CKEDITOR.instances.content.getData();if(editor_data==null||editor_data==""){alert("資料為空白不能提交");}else{if(confirm(editor_data)){document.myform.submit();}}}</script><title>ckeditor富文本測試-- by jCuckoo</title></head><body><form action="doTest.jsp" name="myform" method="post"><textarea class="ckeditor" cols="80" id="content" name="content"rows="10"> CKEditor Test......(此處的內容會在編輯器中顯示)--by jCuckoo</textarea> <input type="button" onclick="test()" value="提交資料"/> </form></body></html>
效果如下：
點擊提交按鈕時，進行非空驗證，如果不是空，彈出確認視窗。
處理資料頁面doTest.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>擷取傳遞的資料 -- by jCuckoo</title> </head> <body> <%request.setCharacterEncoding("gbk"); %> <%=request.getParameter("content") %> </body></html>
提交後，資料顯示效果如下：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
