laravel-admin联动选择展示时ueditor样式错乱

news2024/12/24 9:02:44

问题

录入内容时,根据资源类型,展示不同的需要录入的内容,很常见的功能,但是在切换时,编辑器一直出不来,如图:
在这里插入图片描述

代码如下:

  $form->radio('type', '资源类型')
                    ->when(2, function (Form $form) {
                        $form->ueditor('content', '文章内容');
                    })
                    ->when(1, function (Form $form) use (&$class) {
                        $form->ueditor('xianbingshi', '病例现病史');
                        $form->ueditor('jiazushi', '病例家族史');
                    })
                    ->options([1,2])
                    ->default(2);

解决方法

感觉写法没问题,那我就开始看控制台,看样式,为啥没出来,发现了这个:
在这里插入图片描述
找到了原因,就好解决了,我本来是打算直接用js来改变宽度的,如下:

 $js = <<<JS
                    window.onload=function() {
                      console.log($('.cascade-field_type-_normal_-1-0 .form-group .col-md-8').children());
                    $('.cascade-field_type-_normal_-1-0 #edui282').width('769px');
                    // $('.cascade-field_type-_normal_-1-0 #edui282').addClass('zhang');
                    $('.cascade-field_type-_normal_-1-0 #edui282 #edui282_iframeholder').width('769px');
}
JS;
                Admin::script($js);

但是一直没生效,后来发现,是找不到id为edui282的元素,因为是script类型的;后来发现能找到类**.edui-default .edui-editor**,干脆直接在ueditor.css中改了样式;

.edui-default .edui-editor {
    border: 1px solid #d4d4d4;
    background-color: white;
    position: relative;
    overflow: visible;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    width: auto!important;//这个是加的
}

.edui-default .edui-editor-iframeholder {
    position: relative;
    width: auto !important;//这个是加的
    /*for fix ie6 toolbarmsg under iframe bug. relative -> static */
    /*_position: static !important;*
}

然后让其css生效就可以了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1010042.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Kubenetes之Pod详解

Pod详解 一、Pod基础概念1.概念2.在Kubrenetes集群中Pod有如下两种使用方式3.pause容器使得Pod中的所有容器可以共享两种资源4.kubernetes中的pause容器主要为每个容器提供以下功能5.Kubernetes设计这样的Pod概念和特殊组成结构有什么用意6.通常把Pod分为两类 二、容器的分类&a…

sql中怎么查books表下面的内容

要查询 books 表中的所有内容&#xff0c;你可以使用以下 SQL 语句&#xff1a; USE bookmanagement; -- 选择数据库 SELECT * FROM books; -- 查询books表中的所有内容如果你使用的是命令行界面 (mysql 客户端) 来操作数据库&#xff0c;可以直接在命令提示符中输入上述命令…

微信公众号迁移步骤

公众号账号迁移的作用是什么&#xff1f;只能变更主体吗&#xff1f;长期以来&#xff0c;由于部分公众号在注册时&#xff0c;主体不准确的历史原因&#xff0c;或者公众号主体发生合并、分立或业务调整等现实状况&#xff0c;在公众号登记主体不能对应实际运营人的情况下&…

算法通过村第七关-树(递归/二叉树遍历)白银笔记|递归实战

文章目录 前言1. 深入理解前中后序遍历从小到大递推分情况讨论&#xff0c;明确结束条件组合出完整的方法&#xff1a;从大到小 画图推演 总结 前言 提示&#xff1a;没有客观公正的记忆这回事&#xff0c;所有的记忆都是偏见&#xff0c;都是为自己的存活而重组过的经验。--国…

LeetCode(力扣)452. 用最少数量的箭引爆气球Python

LeetCode452. 用最少数量的箭引爆气球 题目链接代码 题目链接 https://leetcode.cn/problems/minimum-number-of-arrows-to-burst-balloons/description/ 代码 class Solution:def findMinArrowShots(self, points: List[List[int]]) -> int:if len(points) 0:return 0…

固定资产管理中净值怎么算

在资产管理的领域中&#xff0c;我们经常听到“净值”这个词。然而&#xff0c;对于许多人来说&#xff0c;净值的概念仍然模糊不清。本文将试图揭示固定资产管理的净值计算方法&#xff0c;并提供一些创新的观点。  我们需要明确什么是净值。在财务术语中&#xff0c;净值是…

一同走进Linux的“基操”世界

一同走进Linux的“基操”世界 众所周知&#xff0c;Linux是一个开源、免费的操作系统&#xff0c;其稳定性、安全性、处理多并发能力已经得到业界的认可&#xff0c;可以说&#xff0c;Linux现在就像是一个“当红明星”&#xff0c;其实力赢得了大多数人的赞同&#xff0c;流量…

机器学习——贝叶斯(三种分布)/鸢尾花分类分界图/文本分类应用

0、前言&#xff1a; 机器学习中的贝叶斯的理论基础是数学当中的贝叶斯公式。这篇博客强调使用方法&#xff0c;至于理论未作深究。机器学习中三种类型的贝叶斯公式&#xff1a;高斯分布&#xff08;多分类&#xff09;、多项式分布&#xff08;文本分类&#xff09;、伯努利分…

2000-2021年上市公司数字化转型数据(MDA报告词频、文本统计)

2000-2021年上市公司数字化转型数据&#xff08;MD&A报告词频、文本统计&#xff09; 1、时间&#xff1a;2000-2021年 2、来源&#xff1a;上市公司NB 3、范围&#xff1a;上市公司 4、指标&#xff1a;包括人工智能技术、大数据技术、云计算技术、区块链技术、数字技…

【深度学习】 Python 和 NumPy 系列教程(十三):Matplotlib详解:1、2d绘图(上):折线图、散点图、柱状图、直方图、饼图

目录 一、前言 二、实验环境 三、Matplotlib详解 0、绘图风格 1、2d绘图类型 0. 设置中文字体 1. 折线图&#xff08;Line Plot&#xff09; 2. 散点图&#xff08;Scatter Plot&#xff09; 3. 柱状图&#xff08;Bar Plot&#xff09; 4. 直方图&#xff08;Histogr…

【千万别上当】揭秘又一个割韭菜的项目:明星网红直播切片项目

今天在某乎浏览内容&#xff0c;看到一篇文章《我做了10个某音号&#xff0c;不拍视频&#xff0c;不直播&#xff0c;光靠剪辑明星素材月入8K&#xff0c;给缺钱的朋友推荐一个无脑赚Q的自媒体项目》&#xff0c;点击进去一看&#xff0c;洋洋洒洒估计有一两万字&#xff0c;过…

对西安交大轴承数据集XJTU-SY_Bearing_Datasets进行读取和处理:

对西安交大轴承数据集XJTU-SY_Bearing_Datasets进行读取和处理&#xff1a; 读取交大全寿命数据并显示 1.python 读取任意一个工况里的任意一个轴承数据的任意文件csv #读取数据集的CSV文件并显示 import csv import matplotlib.pyplot as pltdef csv_read(CSV_data,CSV_numb…

JavaScript事件流:深入理解事件处理和传播机制

&#x1f3ac; 岸边的风&#xff1a;个人主页 &#x1f525; 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想&#xff0c;就是为了理想的生活 ! 目录 引言 1. 事件流的发展流程 1.1 传统的DOM0级事件 1.2 DOM2级事件和addEventListener方法 1.3 W3C DOM3级事件 …

JRedis的基本操作,基本数据类型操作

Redis的基本数据类型&#xff1a; stringhashlistsetzset {public static void main(String[] args) {Jedis jedis new Jedis("127.0.0.1", 6379);// stringjedis.set("hello", "word");String hello jedis.get("hello");System.o…

Packet Tracer安装、汉化

Packet Tracer是一款由思科系统开发的网络模拟器&#xff0c;用于学习和实验网络配置、协议和拓扑结构。它提供了一个虚拟的网络环境&#xff0c;让用户能够在不需要实际硬件设备的情况下进行网络实验和模拟。 安装 Packet Tracer的安装注册&#xff1a;在Packet Tracer软件上…

Acwing.885 求组合数l

题目 给定n组询问&#xff0c;每组询问给定两个整数a&#xff0c;b&#xff0c;请你输出C mod (10&#xff0b;7)的值。 输入格式 第—行包含整数n。 接下来n行&#xff0c;每行包含—组a和b。 输出格式 共n行&#xff0c;每行输出一个询问的解。 数据范围 1≤n ≤ 1000…

基于深度学习网络的烟雾检测算法matlab仿真

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 2.算法运行软件版本 matlab2022a 3.部分核心程序 .........................................................................% 预处理训练数…

PostgreSQL 数据备份恢复

文章目录 PostgreSQL 备份方式SQL备份&#xff08;逻辑备份&#xff09;文件系统备份&#xff08;物理备份&#xff09;归档备份&#xff08;物理备份&#xff09; 逻辑备份&恢复物理备份&恢复&#xff08;全量&#xff09;备份恢复 物理备份&恢复&#xff08;某个…

Linux高并发服务器开发第四章:Linux网络编程

1. 网络结构模式 C/S结构 简介 服务器 - 客户机&#xff0c;即 Client - Server&#xff08;C/S&#xff09;结构。C/S 结构通常采取两层结构。服务器负责数据的管理&#xff0c;客户机负责完成与用户的交互任务。客户机是因特网上访问别人信息的机器&#xff0c;服务器则是…

HDMI字符显示实验

FPGA教程学习 第十五章 HDMI字符显示实验 文章目录 FPGA教程学习前言实验原理程序设计像素点坐标模块字符叠加模块 实验结果知识点总结 前言 在HDMI输出彩条的基础上输出osd叠加信息。 实验原理 实验通过字符转换工具将字符转换为 16 进制 coe 文件存放到单端口的 ROM IP 核…