使用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做操作结果提示时,发现如果页面超出屏幕的高度时,弹出的提示不是屏幕居中,而是在页面高度的中间,如果一个页面的高度比较大,就看不到提示了. 还有一种 ...
随机推荐
- 2017-2018-2 20165325 实验二《Java面向对象程序设计》实验报告
一.面向对象程序设计-1 1.检查点要求 参考 http://www.cnblogs.com/rocedu/p/6371315.html#SECUNITTEST 参考 http://www.cnblo ...
- 当linux中的所有指令突然不能使用的时候
接到同事电话,线上linux系统所有命令执行不了(由于其误操作执行一些命令) 此时可以按以下步骤解决问题: 1.首先导入临时变量(重启虚拟机之后失效),使得所有命令行暂时可以用 直接在命令行执行以下命 ...
- MySQL索引调优【转】
一.关于查询计划 其实,关于所有的关系型数据库中,在运行T-SQL语句的时候,在查询器进行编译运行的同时,都会有着自己的内部的一个优化过程,而这优化之后的产物就是:执行计划. 在SQL SERVER中 ...
- Python运维开发基础04-语法基础【转】
上节作业回顾(讲解+温习90分钟) #!/usr/bin/env python3 # -*- coding:utf-8 -*- # author:Mr.chen # 仅用列表+循环实现“简单的购物车程 ...
- 专题1:记忆化搜索/DAG问题/基础动态规划
A OpenJ_Bailian 1088 滑雪 B OpenJ_Bailian 1579 Function Run Fun C HDU 1078 FatMouse and Chee ...
- Spring MVC的核心控制器DispatcherServlet的作用
关于Spring MVC的核心控制器DispatcherServlet的作用,以下说法错误的是( )? 它负责接收HTTP请求 加载配置文件 实现业务操作 初始化上下应用对象ApplicationC ...
- FFmpeg Commits on May 30, 2017 remove libschroedinger & libnut
FFmpeg Commits on May 30, 2017 https://github.com/FFmpeg/FFmpeg/commit/220b24c7c97dc033ceab1510549f6 ...
- mysql多表关联update修改操作
UPDATE province_yunnan_salary s1 JOIN province_guangdong_salary s2 ON s1.user_name= s2.user_name S ...
- how to get address of member function
see:http://www.cplusplus.com/forum/general/136410/ & http://stackoverflow.com/questions/8121320/ ...
- [记录]一个有趣的url请求(nodejs)
1 前言 IDE是webstrom,跟项目编程语言,应该没有多大关系. 2 现象 两个看起来是一样的url,但是一个能访问一个不能访问. 然后,复制url到console中发现了差异,分别是:file ...