使用layer弹出Ueditor实现父子传值
Layear的代码:
function tankuang() {
layer.open({
type: 2,
title: false,
area: ['800px', '400px'],
closeBtn: 0,
shadeClose: true,
skin: 'yourclass',
content: '@Url.Action("PartialView", "UEditor")',
});
}
Ueditor代码:
var editor = new baidu.editor.ui.Editor({
UEDITOR_HOME_URL: '/Scripts/ueditor/',//配置编辑器路径
iframeCssUrl: '/Scripts/ueditor/themes/iframe.css',//样式路径
initialContent: '',//初始化编辑器内容
autoHeightEnabled: true,//高度自动增长
minFrameHeight: 500,//最小高度
autoFloatEnabled: true,
initialFrameWidth: 784,
initialFrameHeight: 400
});
editor.render('editor');
获取按钮中的值:
function getValue(val) {
btnValue = val;
}
<input type="button" name="zhishi" id="zhishi" value="基础讲解" onclick="tankuang(); getValue(this.value)" />
用div来显示图片,textarea的值存入数据库
<div>
<div id="knowledgeTitle" style="display:none;float:left;width:70px;">知识点标题</div>
<input type="text" name="titleValue" value="" id="txtContent" hidden="hidden" />
</div> <div>
<textarea id="divOneyc" name="editorOne" hidden="hidden" rows="10" cols="40"></textarea>
</div> <div id="knowledgeContent" style="display:none;float:left;width:70px;">知识点标题</div>
<div id="divOne" name="editorOne" style="width: 700px; height: 400px; border: black 1px solid; font-size:small; line-height:1; overflow:auto;"
hidden="hidden">
</div>
同步值
//同步和Index的内容
function getPlainTxt() {
var arr = [];
arr.push(UE.getEditor('editor').getPlainTxt());
localStorage.removeItem("code"); localStorage.setItem("code", arr.join('\n'));
var data = localStorage.getItem("code");
if (data && data.length > 0) {
parent.mes = arr.join('\n');
parent.document.getElementById('divOne').innerHTML = data;
//给textarea获取值
parent.document.getElementById('divOneyc').innerHTML = data; }
parent.layer.closeAll(); parent.document.getElementById("knowledgeContent").style.display = "block"; parent.document.getElementById("divOne").style.display = "block";
//让textarea永远隐藏
parent.document.getElementById("divOneyc").style.display = "none"; //同步标题的内容 var title = document.getElementById("title").value; localStorage.removeItem("valuetxt");
localStorage.setItem("valuetxt", title);
var txtValue = localStorage.getItem("valuetxt");
if (txtValue && txtValue.length > 0) {
parent.document.getElementById("knowledgeTitle").style.display = "block";
parent.document.getElementById("txtContent").value = txtValue;
} parent.document.getElementById("txtContent").style.display = "block";
}
<div>
知识点标题
<input type="text" class="biaoti" name="biaoti" value="" id="title" />
</div> <div>
基本内容
<textarea id="editor" name="editor"></textarea>
</div
效果:


父页面显示的效果:

使用layer弹出Ueditor实现父子传值的更多相关文章
- 使用layer 弹出对话框 子父页面相互参数传递 父页面获取子页面参数实例
一.先看效果: 1.点击三个点的图标弹出了子页面: 2.子页面调用父页面方法,图一调用父页面方法,图二得到父页面var变量. 3.选择之后,关闭弹框,父页面得到子页面单选框选择的v ...
- HTML页面使用layer弹出框输入数据
javascript中layer是一款近年来备受青睐的web弹层组件,layer.open对弹出框进行输入信息,并处理返回结果.详细介绍http://layer.layui.com/ 部署:将laye ...
- layer弹出信息框API
首先向大家推荐layer,在这里也非常感谢贤心的贡献,非常不错的信息框及弹出层解决方案,为一些项目的前端开发提高了很大的效率,希望layer 越办越好! 下面是API,呵呵,官方抄袭过来的,为了自己看 ...
- layer弹出层不居中解决方案
layer弹出层不居中解决方案 代码头中加入以下代码即可 <!doctype html>
- layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案
layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案 >>>>>>>>>>>>> ...
- layer弹出层
最近因为项目要求做了一个layer弹出层demo,先看效果图 好了,现在开始上代码 index.jsp <%@ page language="java" import=&qu ...
- layer弹出层详解
前言:学习layer弹出框,之前项目是用bootstrap模态框,后来改用layer弹出框,在文章的后面,我会分享项目的一些代码(我自己写的). layer至今仍作为layui的代表作,她的受众广泛并 ...
- Layer弹出层销毁问题
Layer弹出层销毁问题 最近开发时有个问题记录一下 点击按钮显示相应的图表信息,当时自己点感觉没问题,谁知到测试手里多次点击就会有后续打开的窗口无法渲染问题,看了半天才发现是调用layer.clos ...
- layer弹出层不居中解决方案(转)
@感谢参考文章 原文内容: 一.问题描述 用layer做操作结果提示时,发现如果页面超出屏幕的高度时,弹出的提示不是屏幕居中,而是在页面高度的中间,如果一个页面的高度比较大,就看不到提示了. 还有一种 ...
随机推荐
- Python学习笔记-循环语句
While 循环语句 flag=False name = raw_input("请输入:"); numbers=['羊爸爸','羊妈妈','羊宝','牛宝'] while len( ...
- 10分钟轻松学会 Python turtle 绘图
python2.6版本中后引入的一个简单的绘图工具,叫做海龟绘图(Turtle Graphics),turtle库是python的内部库,使用导入即可 import turtle 先说明一下turtl ...
- libevent学习笔记 一、基础知识【转】
转自:https://blog.csdn.net/majianfei1023/article/details/46485705 欢迎转载,转载请注明原文地址:http://blog.csdn.net/ ...
- 全面接触PDF:最好用的PDF软件汇总(转)
全面接触PDF:最好用的PDF软件汇总(2010-12-07更新): http://xbeta.info/pdf-software.htm 比较全面的c#帮助类,各种功能性代码: https://gi ...
- python 指定日期图片文件删除
手机使用python操作图片文件 起因 前几天去国图拍了一本书,一本心理学方面的书,也许你问我为什么不去买一本,或者去网上找pdf. 其实吧,关于心理学方面的书可以说在市面上一抓就是一堆,至于拍这本书 ...
- SQL Server Profiler 常见问题总结
1.跟踪指定数据库 SELECT DB_ID('数据名称') 原文:https://jingyan.baidu.com/article/647f0115be128a7f2048a87d.html 2. ...
- EF 常见异常总结
问题:System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invoca ...
- OpenStack实践系列④计算服务Nova
OpenStack实践系列④计算服务Nova 3.6 Nova控制节点的部署创建服务的凭证,完成下列步骤: 创建nova用户,并加入到service项目中,赋予admin权限 [root@node1 ...
- Windows 下搭建 SVN服务器及使用
目录 一 .安装Visual SVN 二.配置SVN 三.安装TortoiseSVN 四.上传项目到远程仓库 五.从远程仓库下载项目 六.检出项目 七.版本回退 参考链接 http://blog.cs ...
- Android广播机制
原文出处: Android总结篇系列:Android广播机制 1.Android广播机制概述 Android广播分为两个方面:广播发送者和广播接收者,通常情况下,BroadcastReceiver指的 ...