xhEditor具备在编辑框中插入图片和音频,但是默认情况时关闭的,可以通过如下形式来实现在编辑框中插入图片并显示在编辑框中。下面实现利用struts上传图片,需要注意的是xhEditor上传图片时参数名为filedata。
1、JSP页面
<textarea class="xheditor {upBtnText:'浏览',upImgUrl:'uploadAction!uploadImg',upImgExt:'jpg,jpeg,gif,png'}"></textarea>
2、action
import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletContext;
import org.apache.struts2.ServletActionContext;
import org.springframework.stereotype.Component;
import com.opensymphony.xwork2.ActionSupport;
@Component("uploadAction")
public class UploadAction extends ActionSupport {
/**
*
*/
private static final long serialVersionUID = 7087202718619368736L;
private File filedata;
private String filedataFileName;
private String filedataContentType;
public void uploadImg() {
ServletContext sc = ServletActionContext.getServletContext();System.out.println(sc.getContextPath());
if(filedata!=null){
String dataDir = sc.getRealPath("/images/upload");
String fileType = filedataFileName.substring(filedataFileName.lastIndexOf("."));
int na = (int)(Math.random() * 9999.0D);
String tempName = new Long(System.currentTimeMillis()).toString() + String.valueOf(na) + fileType;
File savedFile = new File(dataDir, tempName);
filedata.renameTo(savedFile);
tempName = sc.getContextPath() + "/images/upload/" + tempName;
try {
PrintWriter out = ServletActionContext.getResponse().getWriter();
out.print("{\"err\":\"\",\"msg\":\"" + tempName + "\"}");
out.flush();
out.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
public File getFiledata() {
return filedata;
}
public void setFiledata(File filedata) {
this.filedata = filedata;
}
public String getFiledataFileName() {
return filedataFileName;
}
public void setFiledataFileName(String filedataFileName) {
this.filedataFileName = filedataFileName;
}
public String getFiledataContentType() {
return filedataContentType;
}
public void setFiledataContentType(String filedataContentType) {
this.filedataContentType = filedataContentType;
}
}
分享到:
相关推荐
Xheditor是一款基于JavaScript的开源富文本编辑器,它提供了多种格式化选项,如字体、字号、颜色、对齐方式等,同时支持插入图片、超链接、表格等元素。在ASP.NET环境中,Xheditor通常通过AJAX技术与服务器进行交互...
方法2:利用xhEditor提供的jQuery插件接口来实现对特定textarea的初始化和传递参数,例: $('#elm1').xheditor(); 或者 $('#elm1').xheditor({tools:'mini'}); 特别说明:两种初始化方法只能选择其中一种使用,如果...
- **丰富的编辑功能**:提供加粗、斜体、下划线、字体颜色、字号调整、段落样式等基础编辑功能,以及插入图片、链接、表格、代码块等高级功能。 - **实时预览**:用户编辑时可以即时看到效果,提升编辑体验。 - **...
- **图片处理**: 支持图片上传、拖拽插入,图片可进行缩放、裁剪等操作。 - **链接管理**: 方便创建、编辑和删除超链接,支持邮件链接和锚点链接。 - **表格操作**: 可以创建、编辑表格,调整行列、合并单元格,...
在这款小巧而功能强大的编辑器中,开发者可以为网站用户提供类似于Microsoft Word的编辑体验,实现文字编辑、格式化、图片上传、链接插入等多种功能。本文将深入探讨XHEditor1.1.14的核心特性、使用方法以及常见问题...
《深入解析xheditor:...通过深入理解其工作原理和特性,开发者可以充分利用xheditor的强大功能,打造符合自身需求的文本编辑体验。无论是个人博客、论坛还是企业级应用,xheditor都能提供稳定且高效的编辑解决方案。
4. **插件化设计**: 具有良好的扩展性,可以通过安装插件来实现更多高级功能,如图片上传、视频插入等。 5. **支持多种编辑模式**: 可切换为源代码模式、可视化模式和预览模式,满足不同用户需求。 6. **完善的API...
XHEditor是一款基于JavaScript的WYSIWYG(所见即所得)在线编辑器,它能够将HTML文本框转变为一个功能完善的文字编辑界面,用户可以直接在浏览器中进行文本格式化、插入图片、链接等操作,极大地提升了网页表单的...
3. **后端交互**:利用XHEditor的API,可以获取用户在编辑器中输入的内容,并将其发送到服务器端进行处理。JSP可以通过HTTP请求接收这些数据,进行存储或者进一步处理。 4. **数据回显**:当需要显示已保存的内容时...
- **论坛发帖**:用户可以通过XHEditor方便地编辑帖子,插入图片、链接,提升讨论质量。 - **博客写作**:博主可以利用XHEditor的丰富格式选项美化文章,增强可读性。 - **在线文档编辑**:在协同办公环境中,团队...
《xhEditor编辑器V0.97在Web表单中的应用详解》 xhEditor是一款功能强大的网页富文本编辑器,它为Web开发者提供了...通过深入研究和实践,我们可以充分利用xhEditor的特性,为用户提供更加友好和高效的文本编辑体验。
用户可以通过拖放、点击按钮或使用快捷键来完成文字格式化、插入图片、链接、表格等操作,极大地提升了网页内容编辑的效率。XHEditor的设计目标是轻量级、高效且易于集成到现有项目中,这使得它成为许多开发者的首选...
- **丰富的编辑功能**:包括字体设置、字号调整、颜色选择、段落对齐、列表、插入图片、超链接、表格、代码高亮等。 - **实时预览**:编辑内容时可实时预览效果,提高编辑效率。 - **多语言支持**:支持中文、...
XHEditor-1.1.9是这样一个工具,它为网页提供了强大的富文本编辑功能,使得用户在网页上可以方便地进行文字编辑、格式调整和内容插入。这款编辑器以其高效、稳定和易用性赢得了开发者们的青睐。 XHEditor-1.1.9是一...
- **丰富的编辑功能**:包含了字体、字号、颜色、对齐方式、列表、插入图片、链接、表格等基本编辑功能,还支持HTML代码编辑模式。 - **插件扩展**:通过插件机制,开发者可以自定义或扩展编辑器的功能,如添加...
3. **事件监听**:利用xheditor提供的API,可以监听编辑器的各类事件,如内容改变、文件上传等,进行相应的处理。 四、本地上传文件功能 xheditor的本地上传文件功能是其一大亮点,通过配置参数,可以设定上传文件...
它支持多种浏览器,并提供了丰富的编辑功能,如字体设置、颜色调整、图片上传、链接插入等。开发者可以根据项目需求定制编辑器的工具栏,以满足特定的界面和交互需求。XHEditor的1.1.6版本可能包含了性能优化和新...
2. **丰富的编辑功能**:支持文本格式化、字体设置、颜色调整、列表、链接插入、图片上传、表格操作等常见编辑操作,满足日常文档处理需求。 3. **多语言支持**:xheditor不仅支持中文,还提供了英文和其他多语言...
- **图片上传**: xheditor内置了图片上传功能,允许用户直接在编辑器中上传图片,并将其插入到文档中。 - **文件管理**: 可以集成文件管理器插件,方便用户选择和插入本地文件。 - **代码高亮**: 对于技术类网站,...
3. 集成了图片上传、视频插入、表格编辑等功能。 4. 可自定义工具栏,满足不同场景需求。 5. 兼容主流浏览器,包括IE、Firefox、Chrome、Safari和Opera。 在ASP.NET中整合xheditor,主要涉及以下几个关键步骤: 1. ...