51,408
社区成员
发帖
与我相关
我的任务
分享关于struts2 ckeditor文件上传的问题!
我在插件的时候，文件能够上传成功，但是会弹出一个错误！忘那位高手能够帮我检查一下：如果要源码的可以和我要：我qq是:153398644
...全文
请发表友善的回复…
发表回复
xuchengfeifei 2010-05-29
- 打赏
- 举报
最后运行的结果图片能够上传成功，但是出现一个错误，而且结果 出来了：找了很久都没有找到是什么原因：xuchengfeifei 2010-05-29
- 打赏
- 举报
config.js如下:
/*
Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config )
{
config.language = 'zh-cn';
config.width = 800;
config.height = 300;
config.removePlugins = 'elementspath';
config.extraPlugins = 'myplugin,linkbutton,myplugins,myAddImage' //新建插件
//config.extraPlugins = 'myplugins' //新建插件
};
页面内容如下：
<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQuery adapter - CKEditor Sample</title>
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckeditor/adapters/jquery.js"></script>
<script src="ckeditor/sample.js" type="text/javascript"></script>
<link href="ckeditor/sample.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
//<![CDATA[
$(function()
{
var config = {
toolbar:
[
['Source','-','Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
['UIColor'],
['linkbutton'],
['MyButton'],
['MyButtons'],
['AddImage']
],
filebrowserUploadUrl : 'word.action'
};
$('.jquery_ckeditor').ckeditor(config);
});
//]]>
</script>
</head>
<body>
<form action="sample_posteddata.php" method="post">
<p>
<textarea class="jquery_ckeditor" cols="80" 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>
</p>
<p>
<input type="submit" value="Submit" />
</p>
<div id="show">
${result}
</div>
</form>
</body>
</html>
/*
Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config )
{
config.language = 'zh-cn';
config.width = 800;
config.height = 300;
config.removePlugins = 'elementspath';
config.extraPlugins = 'myplugin,linkbutton,myplugins,myAddImage' //新建插件
//config.extraPlugins = 'myplugins' //新建插件
};
页面内容如下：
<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQuery adapter - CKEditor Sample</title>
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckeditor/adapters/jquery.js"></script>
<script src="ckeditor/sample.js" type="text/javascript"></script>
<link href="ckeditor/sample.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
//<![CDATA[
$(function()
{
var config = {
toolbar:
[
['Source','-','Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
['UIColor'],
['linkbutton'],
['MyButton'],
['MyButtons'],
['AddImage']
],
filebrowserUploadUrl : 'word.action'
};
$('.jquery_ckeditor').ckeditor(config);
});
//]]>
</script>
</head>
<body>
<form action="sample_posteddata.php" method="post">
<p>
<textarea class="jquery_ckeditor" cols="80" 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>
</p>
<p>
<input type="submit" value="Submit" />
</p>
<div id="show">
${result}
</div>
</form>
</body>
</html>
xuchengfeifei 2010-05-29
- 打赏
- 举报
我的源码是：
plugin.js如下
CKEDITOR.plugins.add( 'myAddImage',{
init : function( editor )
{
/*
/* 获取CKEditorFuncNum//这里是处理url链接的.
*/
var getFuncNum = function(url) {
var reParam = new RegExp('(?:[\?&]|&)CKEditorFuncNum=([^&]+)', 'i') ;
var match = url.match(reParam) ;
return (match && match.length > 1) ? match[1] : '' ;
};
/*
/* iframe onload处理
* 这段可以放在外面，根据不同的返回值自行进行处理
*/
var getAjaxResult = function (t){
var _id = this.getId();
var _doc = this.getFrameDocument();
//获取页面返回值
var data = _doc.getBody().getHtml();
//firebrowser的处理
window.parent.CKEDITOR.tools.callFunction(t.listenerData, data);
this.removeListener('load', getAjaxResult);
}
CKEDITOR.dialog.add( 'myAddImage', function( editor )
{
return {
title : '添加图片',
minWidth : 400,
minHeight : 200,
contents :
[
{
id : 'addImage',
label : '添加图片',
title : '添加图片',
filebrowser : 'uploadButton',
elements :
[
{
id : 'txtUrl',
type : 'text',
label : '图片网址',
required: true
},
{
id : 'doc',
type : 'file',
label : '上传图片',
style: 'height:40px',
size : 38
},
{
type : 'fileButton',
id : 'uploadButton',
label : '上传',
filebrowser :
{
action : 'QuickUpload',
target : 'addImage:txtUrl',
onSelect:function(fileUrl, errorMessage){
//在这里可以添加其他的操作
}
},
onClick: function(){
var d = this.getDialog();
var _photo = d.getContentElement('addImage','doc');
_funcNum = getFuncNum(_photo.action);
var _iframe = CKEDITOR.document.getById(_photo._.frameId);
//可以查看ckeditor.event doc 了解此段代码
//http://docs.cksource.com/ckeditor_api/
_iframe.on('load', getAjaxResult, _iframe, _funcNum);
},
'for' : [ 'addImage', 'doc']
}
]
}
],
onOk : function(){
_src = this.getContentElement('addImage', 'txtUrl').getValue();
if (_src.match(/(^\s*(\d+)((px)|\%)?\s*$)|^$/i)) {
alert('请输入网址或者上传文件');
return false;
}
this.imageElement = editor.document.createElement( 'img' );
this.imageElement.setAttribute( 'alt', '' );
this.imageElement.setAttribute( 'src', _src );
//图片插入editor编辑器
editor.insertElement( this.imageElement );
}
};
});
editor.addCommand( 'myImageCmd', new CKEDITOR.dialogCommand( 'myAddImage' ) );
editor.ui.addButton( 'AddImage',
{
label : '图片',
icon:this.path+'upload-start.gif', //toolbar上icon的地址,要自己上传图片到images下
command : 'myImageCmd'
});
},
requires : [ 'dialog' ]
});
plugin.js如下
CKEDITOR.plugins.add( 'myAddImage',{
init : function( editor )
{
/*
/* 获取CKEditorFuncNum//这里是处理url链接的.
*/
var getFuncNum = function(url) {
var reParam = new RegExp('(?:[\?&]|&)CKEditorFuncNum=([^&]+)', 'i') ;
var match = url.match(reParam) ;
return (match && match.length > 1) ? match[1] : '' ;
};
/*
/* iframe onload处理
* 这段可以放在外面，根据不同的返回值自行进行处理
*/
var getAjaxResult = function (t){
var _id = this.getId();
var _doc = this.getFrameDocument();
//获取页面返回值
var data = _doc.getBody().getHtml();
//firebrowser的处理
window.parent.CKEDITOR.tools.callFunction(t.listenerData, data);
this.removeListener('load', getAjaxResult);
}
CKEDITOR.dialog.add( 'myAddImage', function( editor )
{
return {
title : '添加图片',
minWidth : 400,
minHeight : 200,
contents :
[
{
id : 'addImage',
label : '添加图片',
title : '添加图片',
filebrowser : 'uploadButton',
elements :
[
{
id : 'txtUrl',
type : 'text',
label : '图片网址',
required: true
},
{
id : 'doc',
type : 'file',
label : '上传图片',
style: 'height:40px',
size : 38
},
{
type : 'fileButton',
id : 'uploadButton',
label : '上传',
filebrowser :
{
action : 'QuickUpload',
target : 'addImage:txtUrl',
onSelect:function(fileUrl, errorMessage){
//在这里可以添加其他的操作
}
},
onClick: function(){
var d = this.getDialog();
var _photo = d.getContentElement('addImage','doc');
_funcNum = getFuncNum(_photo.action);
var _iframe = CKEDITOR.document.getById(_photo._.frameId);
//可以查看ckeditor.event doc 了解此段代码
//http://docs.cksource.com/ckeditor_api/
_iframe.on('load', getAjaxResult, _iframe, _funcNum);
},
'for' : [ 'addImage', 'doc']
}
]
}
],
onOk : function(){
_src = this.getContentElement('addImage', 'txtUrl').getValue();
if (_src.match(/(^\s*(\d+)((px)|\%)?\s*$)|^$/i)) {
alert('请输入网址或者上传文件');
return false;
}
this.imageElement = editor.document.createElement( 'img' );
this.imageElement.setAttribute( 'alt', '' );
this.imageElement.setAttribute( 'src', _src );
//图片插入editor编辑器
editor.insertElement( this.imageElement );
}
};
});
editor.addCommand( 'myImageCmd', new CKEDITOR.dialogCommand( 'myAddImage' ) );
editor.ui.addButton( 'AddImage',
{
label : '图片',
icon:this.path+'upload-start.gif', //toolbar上icon的地址,要自己上传图片到images下
command : 'myImageCmd'
});
},
requires : [ 'dialog' ]
});
