设置实时样式

最新推荐文章于 2023-02-28 14:55:06 发布
最新推荐文章于 2023-02-28 14:55:06 发布
阅读量1.1k 收藏
点赞数 2
分类专栏： jq 文章标签： css3 html 前端 jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiaosao_/article/details/121823896
版权

HTML部分先把页面框架搭建起来
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
页面搭建好后,去到控制器写一个方法查询数据库中所需的样式信息。
在这里插入图片描述
当登录进去的时候用POST方法连接控制器查询并返回所需的样式，获取要配置样式的ID,用JQ中的方法attr对当前ID的行内添加style和data-content属性进行添加样式，最后用返回的数据判断加粗是否打勾，是则对相对应的ID添加样式。
在这里插入图片描述
获取页面经过修改的数据,用JQ的css 方法修改ID相对应的标签的样式。
在这里插入图片描述
获取被修改过的颜色，用JQ的css方法改变ID相对应的标签的背景颜色
在这里插入图片描述
设置还原按钮，点击按钮用POST的方法连接控制器查询并返回所需的样式，获取要配置样式的ID,用JQ中的方法attr对当前ID的行内添加style和data-content属性进行添加样式，最后用返回的数据判断加粗是否打勾，是则对相对应的ID添加样式。
在这里插入图片描述
点击保存按钮获取页面的数据用AJAX把数据传递到控制器。
在这里插入图片描述
控制器接收数据并对数据库进行修改，最后返回保存成功。
效果：
在这里插入图片描述
在这里插入图片描述

汝甚骚吾不及
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
专栏目录
stylus 设置全局样式_自定义网站的显示样式Stylus
weixin_42350606的博客
01-12 1322
自定义网站的显示样式Stylus软件工具 2018-11-01网站页面显示的样子是由网站开发者制定的，但它们并非无法改变，比如在Chrome浏览器中，右键点击页面，选择检查，你可以随意的改变网页内容及其样式，但作为访问者，并不能永久的更改样式。Stylus是一款浏览器插件，可以用于Chrome、Firefox等浏览器，它的作用就是让用户自定义指定网页的样式，保存后即可永久生效。它可以为指定...
qt样式表设置边框_图文讲解：QT样式表StyleSheet的使用与加载
weixin_28710999的博客
01-12 1424
目录0、参考链接1、设计师界面添加样式1.1 几点注意事项2、用程序添加样式2.1 用程序语句添加2.2 用qss文件添加2.2.1 引用qss文件的磁盘路径2.2.2 引用qss文件的资源路径0、相关链接官网的样式表链接：http://doc.qt.io/archives/qt-4.8/stylesheet.html各种控件的样式：http://doc.qt.io/archives/qt-4.8...
QLabel样式的设置
小米的修行之路
12-13 9580
字体样式 font-family: "Microsoft YaHei"; font-size: 14px; font-style: italic; font-weight: bold; color: #BDC8E2; font: bold italic 18px "Microsoft YaHei"; font-family为设置字体类型，标准形式需要加双引号，不加也可能会生效，具体看系统是否支持，中英文都支持，但要保证字体编码支持，一般程序编码为"utf-8"时没问题。 font-size为设..
WPF中为DataGrid设置行样式
u014650759的专栏
12-05 2495
WPF中我们可能会遇到这样的需求，就是需要为不同的行设置行样式，而不是统一的样式，实现方式主要分为两种。 第一种，通过代码设置行样式。首先选中datagrid控件，选择为控件添加loadingrow事件，接着再添加如下代码 private void dataGridView1_LoadingRow(object sender, DataGridRowEventArgs e) ...
VSCode设置Markdown预览样式
subtitle_的博客
01-26 889
VSCode写markdown的插件markdown-preview-enhanced实在太丑了，想着改下markdown的外观。总结以下解决方法：
怎么用JS来动态设置CSS样式
hdxx2022的博客
02-28 2638
/ 在原有样式操作 document.styleSheets[0].addRule(".box", "height: 100px");如果属性有"-"号，就写成驼峰的形式（如textAlign） 如果想保留 - 号，就中括号的形式 element.style["text-align"] = "100px";因JS获取不到css的伪元素，所以可以通过改变伪元素父级的class来动态更改伪元素的样式。
Typora的引用设置多种样式
锦鲤豆
05-17 3996
设置引用多样式 1. 引用多种样式 我想将引用设置为多种样式，但是Typora仅仅支持一种，可以采用VLOOK插件实现，但是VLOOK仅支持导出之后生成。我想要的是实时那种，所以我对Typora进行了修改，最终实现的效果如下图所示。 2. 缺陷（提前说明） 此种方式在==Typora version 0.10.10(beta)==下修改，其他版本是否有效未知，修改之前先备份 此种方式有两个缺陷，如果比较见意，那么就不用做 自定义样式前面必须显式声明，有警告、危险、推荐，这个内容可以按自己要求来设置，在
如何设置ie浏览器css,IE浏览器如何实时编辑CSS样式？IE浏览器实时编辑CSS样式的方法...
weixin_35987118的博客
08-03 750
ie浏览器是一个非常基础的搜索软件，在用户不知道使用什么浏览器的时候可以选择这款搜索软件，功能和搜索内容都是非常简洁的，用户随时都可以放心使用，用户还可以使用浏览器随时便捷，满足自己的搜索需求，这款软件在使用IE浏览器的时候，如果想要实时便捷CSS样式要如何操作呢？有很多用户在使用的时候不知道要如何编辑和操作，那么就让我们一起来看看这款软件到底要如何使用吧！IE浏览器如何实时编辑CSS样式？IE浏...
【安卓】全局字体设置&修改字体样式
07-15
全局字体设置,单独字体设置,附带阿里-惠普体字体包,
Qt 自定义QPushButton样式表(实时生成QSS)
11-20
源码可直接编译运行，自定义QPushButton样式，通过选择背景渐变、边框、字体、字号、鼠标移入移出切换、点击态、圆角设置等自动生成样式code，然后调用setStyleSheet()。
Qt样式表实时编辑工具2套.rar
08-27
Qt样式表实时编辑工具两套，包含QSSEditor,RizekQSSEditor。方便Qt开发人员在设置qt控件的样式
c++与Qt实现QChart使用样例，包含双纵坐标轴参数、样式设置，绘图曲线背景自定义，曲线实时刷新
06-17
QChart使用样例，包含双纵坐标轴参数、样式设置，绘图曲线背景自定义，曲线实时刷新
webstorm-config:Webstorm 配置 - 实时模板、键盘映射、颜色、代码样式
06-04
网络风暴配置这是我的配置文件夹，其中包含： 实时模板键盘映射颜色代码样式用Linux/Windows：从该存储库中复制的文件夹并重新启动 WebStorm执照
vue根据屏幕大小设置css样式（实时监控屏幕大小）
miem_yang的博客
09-02 2797
pc端当屏幕缩小时总会有些css样式不适配 一下基本可以实时监测屏幕大小 下面展示一些 内联代码片。 // 需要动态修改的css <div :class="isWidth ? 'title' : 'title2'"><111111/div> // 定义一个变量 return { data(){ screenWidth:document.body.clientWidth, // 屏幕宽度 isWidth: false // 动态修改css控制变量 } } // 定义一个
layui的穿梭框
xiaosao_的博客
12-28 1406
首先引入CSS样式和Jquery Layui插件 Html部分只有一个fieldast标签和一个设置了ID的div标签 Jq部分直接开启layui中的渲染 然后设置属性值,最主要的是elem属性,输入ID值对当前ID的div进行渲染,最后设置data和htight(列表高度)属性 这是穿梭框中可以手动添加的一些属性 效果: ...
Layui的颜色选择器
xiaosao_的博客
12-09 709
CSS部分和HTML部分先把页面搭建起来 搭建好页面后引入Layui插件。 Js部分调用colorpicker颜色选择器获取页面上的颜色数据进行回调,然后用attr的方法给ID对应的标签添加Style属性,进行设置背景颜色。 Colorpicker的参数如上图 效果： ...
系统权限设置
xiaosao_的博客
11-17 486
首先把数据库相关的表用外键连接起来 Html部分: 先把所需的模块写出来,然后获取所有的模块和模块对应的ID传递到控制器。 控制器接收到数据用传递过来的数据在数据库查询数据，并将查询到的信息返回到视图页面 视图接收返回的数据进行判断，如果ID等于0就是没有权限，移除ID为0的模块。 效果图： ...
qt设置光标隐藏无法实时生效
最新发布
07-16
你可以尝试使用以下方法来实现在Qt中实时隐藏光标： 1. 使用 `setCursor` 方法将光标设置为一个透明的光标样式，从而达到隐藏光标的效果。示例代码如下： ```cpp QCursor cursor(Qt::BlankCursor); setCursor(cursor); ``` 2. 如果上述方法无效，你可以尝试通过修改窗口属性来隐藏光标。示例代码如下： ```cpp setWindowFlags(Qt::FramelessWindowHint); // 设置窗口为无边框窗口 setAttribute(Qt::WA_TranslucentBackground); // 设置窗口背景透明 ``` 请注意，以上方法可能因环境和平台的不同而有所差异。如果问题仍然存在，请提供更多的上下文信息，以便我能够更好地帮助你解决问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

汝甚骚吾不及

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值