当前位置: 首页 > news >正文

fckeditor编辑器的两种使用方法

需要的资源包我放我资源里了,不要积分

https://download.csdn.net/download/wybshyy/88245895

首先把FredCK.FCKeditorV2.dll添加到引用

具体方法如下,一个是客户端版本,一个是服务器端版本

客户端版本:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CaseTemplate_ADD.aspx.cs" Inherits="MyProject.CaseTemplate_ADD" %>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>编辑</title><link href="/JS/layui/css/layui.css?v=1.0" rel="stylesheet" /><link href="/layuiadmin/style/admin.css?v=1.0" rel="stylesheet" /><script src="/JS/jquery-3.4.1.js?v=1.0"></script><script src="/layuiadmin/layui/layui.js?v=1.0"></script><script src="/layuiadmin/lib/admin.js?v=1.0"></script><script src="/JS/layui/layui.js?v=1.0"></script><script src="/kfckeditor/fckeditor.js?v=1.0"></script></head>
<body><div class="layui-fluid"><div class="layui-card"><div class="layui-card-body" style="padding: 15px;"><form class="layui-form" action=""><div class="layui-form-item"><label class="layui-form-label">名称</label><div class="layui-input-block"><input type="text" id="names" lay-verify="names" autocomplete="off" placeholder="请输入名称" class="layui-input" value="<%=strNames %>" /></div></div><div class="layui-form-item"><label class="layui-form-label">模板内容</label><div class="layui-input-block"><script type="text/javascript">var fckeditor = new FCKeditor('FCKeditor1');//新建一个fckeditor实例fckeditor.BasePath = "/kfckeditor/";//设置编辑器的位置,该位置一定要以/结尾,这个basepath是指 fckeditor文件夹下所有文件的地址,默认值是这个,但是我们一般前面还要加上工程的名字,如/prj/fckeditor/这样fckeditor.Create();//创建并且调用一个fckeditor编辑器</script></div></div></form><div class="layui-form-item layui-layout-admin"><div class="layui-input-block"><div class="layui-footer" style="left: 0;"><button class="layui-btn sim_btn">提交</button><input type="button" id="btnReset" class="layui-btn layui-btn-primary" value="重置" /></div></div></div></div></div></div><input type="hidden" id="hdid" value="<%=strid %>" /><script type="text/javascript">//这里一定要设置全局变量,不然下面用的时候,未定义var layer, form, laypage, laydate, upload, layedit, indexs01, indexs02, indexs03;$(function () {layui.use(['index', 'layer', 'form', 'laypage', 'laydate', 'upload', 'jquery', 'layedit'], function () {layer = layui.layer;form = layui.form;laypage = layui.laypage;laydate = layui.laydate;upload = layui.upload;layedit = layui.layedit;//注册layeditvar $ = layui.jquery;});//提交表单$("body").on("click", ".sim_btn", function () {saveData();});});function saveData() {var errorMsg = "";var id = $("#hdid").val();var names = $("#names").val();//var contents = $("#xEditingArea").html();////var oEditor = FCKeditorAPI.GetInstance('FCKeditor1');var oEditor = FCKeditorAPI.GetInstance("FCKeditor1");alert(oEditor.GetXHTML(true));//获取FCK编辑器里的值alert(FCKeditor1);alert(FCKeditor1___Config);return false;if (names == "") {errorMsg = "请输入名称";}//if (names == "") {//    errorMsg = "请输入姓名";FCKeditor1  FCKeditor1___Config//}if (errorMsg != "") {layer.msg(errorMsg, { icon: 7 });return false;}loadIndex = layer.load(0);var url = "/CaseTemplate_ADD.aspx";$.ajax({type: "POST",url: url,dataType: "JSON",data: { 'action': 'SaveData', 'id': id, 'typeID': typeID, 'names': names, 'links': links, 'isShow': isShow, 'orderNum': orderNum },success: function (result) {if (result.State) {layer.close(loadIndex);layer.msg("操作成功", { time: 1000 });setTimeout(closeRefresh, 1000);//关闭当前iframe,刷新指定iframe}else {layer.msg(result.ErrorMsg, { time: 3000 });}}, complete: function (result) {layer.close(loadIndex);}});}</script>
</body>
</html>

服务器端

先在配置文件里配置好,再把资源包放项目里

<appSettings>
    <add key="FCKeditor:BasePath" value="~/kfckeditor/"/>
    <add key="FCKeditor:UserFilesPath" value="~/Files/"/>

</appSettings>

代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test02.aspx.cs" Inherits="MyProject.Test02" %>
<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title></title>
</head>
<body><form id="form1"><div>0000<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" Height="480px"></FCKeditorV2:FCKeditor></div></form>
</body>
</html>

取值后台用FCKeditor1.value就可以了,提交按钮必须要加runat="server" 

http://www.lryc.cn/news/136374.html

相关文章:

  • 数据结构,查找算法(二分,分块,哈希)
  • C++(Qt)软件调试---gdb调试入门用法(12)
  • shell和Python 两种方法分别画 iostat的监控图
  • 设计模式(9)建造者模式
  • PHP 创业感悟交流平台系统mysql数据库web结构apache计算机软件工程网页wamp
  • 工作流程引擎之flowable(集成springboot)
  • leetcode54. 螺旋矩阵(java)
  • go gorm 查询
  • Flutter GetXController 动态Tabbar 报错问题
  • Redis(缓存预热,缓存雪崩,缓存击穿,缓存穿透)
  • UE4/5Niagara粒子特效学习(使用UE5.1,适合新手)
  • from moduleA import * 语句 和import moduleA 的区别
  • 【leetcode 力扣刷题】交换链表中的节点
  • 学会Mybatis框架:让你的代码更具灵活性、可维护性、安全性和高效性【二.动态SQL】
  • Oracle 中 ROWNUM 使用问题记录
  • MySQL数据库:内置函数
  • 【C++杂货铺】探索string的底层实现
  • c++ day1
  • 变动的Python爬虫实现
  • mybatis-plus--配置-(sql)日志输出-自动填充-分页-多数据源-逻辑删除
  • 数据API服务管理功能:解放数据潜力,提升业务效率
  • 云南森林火灾vr消防模拟安全演练系统训练消防员火灾和事故的适应和应对能力
  • (6)(6.2) 任务命令
  • 【consul】
  • Electron环境搭建
  • MinIO线上扩容实战
  • 【微服务】微服务的概论
  • 基于Jenkins自动打包并部署docker环境
  • jvm 运行时数据区
  • Jobs Portal求职招聘系统源码v3.5版本