ckeditor工具栏不显示

刘邵博 发布于 2012/09/16 18:10
阅读 4K+
收藏 0

最近项目要求一个富文本框编辑功能,找到了ckeditor,但是配置上之后,工具栏不显示,经过反复调试,还是没有成功。代码如下:

<%@ page language="java" pageEncoding="UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme() + "://"

+ request.getServerName() + ":" + request.getServerPort()

+ path + "/";

pageContext.setAttribute("ctx",path);;

%>

<html>

<head>

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

<script src="${ctx}/admin/js/jquery-1.7.1.js" type="text/javascript"></script>

<script src="${ctx}/admin/ckeditor/ckeditor.js" type="text/javascript"></script>

<script src="${ctx}/admin/ckeditor/sample.js" type="text/javascript"></script>

<STYLE type="text/css">

.myError li {

font-weight: bold;

color: #EA5200;

}

 

ul,li {

list-style: none;

margin: 5px;

background-color: #A4D3EE;

}

 

div,li {

font-size: 12px;

}

 

div#tabin {

width: 100%;

background: d3e7fc;

}

 

div#tabin li {

background: A4D3EE;

display: block;

float: left;

padding: 4px 8px 4px 8px;

color: blue;

margin-right: 1px;

border-bottom: #FFFFFF;

}

 

div#tabin li a {

cursor: pointer;

}

 

div#tabin div {

background: #d3e7fc;

color: #ffffff;

padding: 8px;

line-height: 22px;

display: none;

}

 

div#tabin li.tabin {

background: d3e7fc;

color: blue;

border: 1px solid #d3e7fc;

}

 

div#tabin div.current {

display: block;

}

 

td.text input,tr.text td input {

width: 100%;

height: 100%;

border-width: 1px;

}

</STYLE>

<script type="text/javascript">

$().ready(function() {

$('#tabin >ul >li').each(function(index) {

$(this).click(function() {

var liNode = $(this);

$('div.current').removeClass('current');

$('li.tabin').removeClass('tabin');

$('#tabin > div').eq(index).addClass('current');

liNode.addClass('tabin');

})

});

});

function addCkeditor(){

window.open(optionalArg1);

}

</script>

</head>

<body bgcolor="#CFDFEF">

<table  style="font: 15" cellpadding="0"  width="100%" height="100%"

cellspacing="0">

<tr>

<td>

<div id="tabin">

<ul>

<li>

<a>附录</a>

</li>

 

<li class="tabin">

<a>前言</a>

</li>

<li>

<a>适用范围</a>

</li>

</ul>

<div>

<table width="100%" height="100%">

<tr>

<td nowrap="nowrap">

<img title="数据库内容" src="../images/database1.jpg"

width="16px" height="18px">

附录

<br>

</td>

</tr>

</table>

</div>

 

<div class="current">

<table width="100%" height="100%">

<tr>

<td nowrap="nowrap">

前言

</td>

<td colspan="9">

<table width="100%" height="100%">

<tr>

<td colspan="3">

<textarea id="foreword" class="ckeditor" name="foreword" style="width:700px;height:300px;">${tbTempStd.foreword}</textarea>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

<div>

<table width="100%" height="100%">

<tr>

<td nowrap="nowrap">

适用范围

</td>

<td colspan="9">

<table width="100%" height="100%">

<tr>

<td colspan="3">

<textarea id="applyArea" class="ckeditor" name="applyArea"  style="width:700px;height:300px;">${tbTempStd.applyArea}</textarea>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

</div>

</td>

</tr>

</table>

 

</body>

<script>

</script>

</html>

哪位大能之士帮帮忙呀,小弟thanks了。


以下是问题补充:

@刘邵博:问题很郁闷,在选项卡中使用富文本编辑器,如kindeditor,ckeditor等,富文本编辑器的工具栏显示不了,在选项卡外面就可以显示,很郁闷!大家有没有遇到这种情况,提点下小弟,谢谢。 (2012/11/14 09:18)
加载中
0
人户
人户
用一个iframe来显示吧
返回顶部
顶部