浅谈layer弹出层按钮颜色修改方法
更新时间：2019年09月11日 09:23:08 作者：wanlin77
今天小编就为大家分享一篇浅谈layer弹出层按钮颜色修改方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
layer弹出层有多种格式的弹出，使用方法也不细述。
在弹出确认框可使用confirm或open方式
在open中
layer.open({
content: '确认提交？',
btn: ["确认", "取消"],
yes: function (index) {
somefunciton...
layer.close(index)
},
btn2: function (index) {
}
});
layer中确认按钮在第一个位置，展示也是按顺序展示
如果和自己项目中的风格不一致，需要把确认按钮和取消按钮互换，如果只是简单的把文字互换了，但是按钮的颜色还是没有变化。
这时我们需要做的有：1：变更按钮顺序，2：修改回调函数，3：修改按钮的颜色
layer.open({
skin: 'demo-class',
content: '确认提交？',
btn: ["取消", "确认"],
yes: function (index) {
layer.close(index)
},
btn2: function (index) {
somefunciton...
}
});
//在页面style中定义按钮css样式
<style>
body .demo-class .layui-layer-btn0{
border-color: #E6E3E6;
background-color: #FFF;
color: black;
}
body .demo-class .layui-layer-btn1{
border-color: #4898d5;
background-color: #2e8ded;
color: #fff;
}
</style>
这样调用就可以实现了，confirm的底层实现也是open方式，所以confim也应该是一样的结果，但没有去实验。
以上这篇浅谈layer弹出层按钮颜色修改方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家分享了一款直接拿来用的页面跳转进度条，由javascript实现，可以直接跳转到相应页面，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-01-01
bootstrap中的 form表单属性role="form"的作用详解
这篇文章主要介绍了bootstrap中的 form表单属性role="form"的作用详解,非常不错，具有参考借鉴价值，需要的朋友参考下吧2017-01-01
这篇文章主要介绍了JavaScript接口实现方法,结合实例形式详细分析了JavaScript接口实现原理、操作步骤与相关注意事项,需要的朋友可以参考下2020-05-05
在web前端开发中,性能优化一直是一个非常重要的话题,JavaScript中延迟加载的方式有很多种,本文就来介绍了javascript中延迟加载的7种方法实现,具有一定的参考价值,感兴趣的可以了解一下2025-01-01
最近参考项目开发，遇到这样一个需求将H5商城页面嵌套到公司微信公众号里，在开发遇到一个棘手的问题，js倒计时失效问题，怎么回事呢？下面说下我使用微信内嵌h5解决的这一问题，需要的朋友参考下吧2017-01-01
这篇文章主要给大家介绍了利用JS实现复制指定对应id的内容到粘贴板（Ctrl+C效果）,文中给出了详细的介绍和示例代码，有需要的朋友可以参考借鉴，下面来一起看看吧。2017-01-01
滑动锚点挺有意思的,可增加一些浏览性,下面这篇文章主要给大家介绍了关于js锚点、操作滚动条滑动scroll的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-03-03
这篇文章主要介绍了javascript定时器完整实现方法,以实例形式分析了定时器的嵌套调用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
二维码作为现代信息传递的重要工具,其黑白色调一直是其标志性特征,然而,有时我们可能希望个性化定制二维码的颜色,以适应特定设计需求或提高可识别性,在这篇文章中,我们将深入探讨如何使用Canvas技术修改二维码的颜色,为二维码添加更多创意和个性2023-11-11
在文章里小编给大家整理的是关于javascript数组的定义及操作的相关知识点，需要的朋友们学习下。2019-11-11
最新评论