layer ui插件显示tips时,修改字体颜色的实现方法


Posted in Javascript onSeptember 11, 2019

今天做调查问卷,又遇到一个蛋疼小问题,记录下。

调查问卷有很多选项是要求必填的,如果不填的话,需要给出友好的提示。用的如下组件:http://layer.layui.com/

1、之前一直默认用的:

<script src="/assets/js/layer/layer.js"></script>
function showMessage(msg, domObj) {
 layer.tips(msg, domObj,{tips:3});//弹出框加回调函数
}
showMessage("选项不能为空", $(this));

效果如下:

layer ui插件显示tips时,修改字体颜色的实现方法

2、ui过来看了下之后,说太丑,要换成白色背景,红色字体

可是查看了半天的官方文档,只看到了修改背景颜色的配置项,没找到改字体色的配置项:

勉强修改背景色后如下:

function showMessage(msg, domObj) {
  layer.tips(msg, domObj,{tips:[3,"red"]});//弹出框加回调函数
 }

layer ui插件显示tips时,修改字体颜色的实现方法

3、最后实在无语,说搞不了,后边同事折腾了一会,过来提供了如下方案:

function showMessage(msg, domObj) {
  layer.tips("<span style='color:red'>"+msg+"</span>", domObj,{tips:[3,'#fff']});//弹出框加回调函数
 }

layer ui插件显示tips时,修改字体颜色的实现方法

好吧,背景色还是可以改的。。。有时候说不行,只是没想到而已

以上这篇layer ui插件显示tips时,修改字体颜色的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquerymobile checkbox及时刷新才能获取其准确值
Apr 14 Javascript
不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象
Jan 11 Javascript
js计算精度问题小结
Apr 22 Javascript
模拟多级复选框效果的jquery代码
Aug 13 Javascript
IE6已终止操作问题的2种情况及解决
Apr 23 Javascript
Javascript中对象继承的实现小例
May 12 Javascript
jquery 设置style:display的方法
Jan 29 Javascript
JavaScript事件类型中焦点、鼠标和滚轮事件详解
Jan 25 Javascript
完善的jquery处理机制
Feb 21 Javascript
Javascript闭包与函数柯里化浅析
Jun 22 Javascript
原生js实现无缝轮播图效果
Jan 11 Javascript
详解Node 定时器
Feb 26 Javascript
layui操作列按钮个数和文字颜色的判断实例
Sep 11 #Javascript
JS模拟浏览器实现全局搜索功能
Sep 11 #Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 #Javascript
使用layui+ajax实现简单的菜单权限管理及排序的方法
Sep 10 #Javascript
修改layui的后台模板的左侧导航栏可以伸缩的方法
Sep 10 #Javascript
layui固定下拉框的显示条数(有滚动条)的方法
Sep 10 #Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 #Javascript
You might like
谈谈PHP语法(3)
2006/10/09 PHP
PHP DataGrid 实现代码
2009/08/12 PHP
PHP缓存技术的使用说明
2011/08/06 PHP
php中利用explode函数分割字符串到数组
2014/02/08 PHP
微信公众平台天气预报功能开发
2014/07/06 PHP
Thinkphp结合ajaxFileUpload实现异步图片传输示例
2017/03/13 PHP
JS获取scrollHeight问题想到的标准问题
2007/05/27 Javascript
Jquery 弹出层插件实现代码
2009/10/24 Javascript
EasyUI 中 MenuButton 的使用方法
2012/07/14 Javascript
js定时器怎么写?就是在特定时间执行某段程序
2013/10/11 Javascript
JavaScript实现的一个计算数字步数的算法分享
2014/12/06 Javascript
编写高质量JavaScript代码的基本要点
2016/03/02 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
2016/04/14 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
jQuery层次选择器用法示例
2016/09/09 Javascript
用director.js实现前端路由使用实例
2017/01/27 Javascript
详解基于vue的移动web app页面缓存解决方案
2017/08/03 Javascript
不得不知的ES6小技巧
2018/07/28 Javascript
javascript/jquery实现点击触发事件的方法分析
2019/11/11 jQuery
bootstrapValidator表单校验、更改状态、新增、移除校验字段的实例代码
2020/05/19 Javascript
详解python3中socket套接字的编码问题解决
2017/07/01 Python
Python实现抓取网页生成Excel文件的方法示例
2017/08/05 Python
深入理解Python中的super()方法
2017/11/20 Python
Python中时间datetime的处理与转换用法总结
2019/02/18 Python
python celery分布式任务队列的使用详解
2019/07/08 Python
python实现简单聊天室功能 可以私聊
2019/07/12 Python
Django 实现Admin自动填充当前用户的示例代码
2019/11/18 Python
基于Python获取照片的GPS位置信息
2020/01/20 Python
python tkinter 设置窗口大小不可缩放实例
2020/03/04 Python
Python读取xlsx数据生成图标代码实例
2020/08/12 Python
Django xadmin安装及使用详解
2020/10/26 Python
Optimalprint加拿大:在线打印服务
2020/04/03 全球购物
退休党员个人对照检查材料思想汇报
2014/09/29 职场文书
2014年专项整治工作总结
2014/11/17 职场文书
2014年圣诞节寄语
2014/12/08 职场文书
青年教师个人总结
2015/02/11 职场文书