layer.confirm()右边按钮实现href的例子


Posted in Javascript onSeptember 27, 2019

layer官方API默认右边按钮=右上角X按钮,点击=关闭弹窗

此方法最终效果是右上角X保留关闭弹窗功能,并且右边按钮能设置(location.href="") 等

之前试过的写法(错误):

layer.confirm('想去哪个网站?',{btn:['新浪','百度']},function(index){

layer.close(index);

location.href="http://www.sina.com" rel="external nofollow" rel="external nofollow" ; }

,function(index){

layer.close(index);

location.href="http://www.baidu.com" rel="external nofollow" rel="external nofollow" ; }

})

第二条函数相当于右边按钮和X绑定在一起,不能分离

经过审查元素,发现了一个强硬的方法,试了一下居然成功了

原理是直接给右边按钮绑上click事件,可以覆盖插件效果

代码如下:

layer.confirm('想去哪个网站?',{icon:3,btn:['新浪','百度']},function(index){         //这里的icon:3 是‘?'图标,在上次博客试出来的共存方法
layer.close(index);
  location.href="http://www.sina.com" rel="external nofollow" rel="external nofollow" ;  
})
$('.layui-layer-btn1').click(function(){              // .layui-layer-btn1 = 右边按钮class名
location.href="http://www.baidu.com" rel="external nofollow" rel="external nofollow" ;  
})

以上这篇layer.confirm()右边按钮实现href的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js中有关IE版本检测
Jan 04 Javascript
得到form下的所有的input的js代码
Nov 07 Javascript
简单选项卡 js和jquery制作方法分享
Feb 26 Javascript
javascript判断是否按回车键并解决浏览器之间的差异
May 13 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
Apr 18 Javascript
jquery Easyui Datagrid实现批量操作(编辑,删除,添加)
Feb 20 Javascript
JavaScript实现QQ聊天消息展示和评论提交功能
May 22 Javascript
基于JS实现移动端左滑删除功能
Jul 28 Javascript
Vue.js实现输入框绑定的实例代码
Aug 24 Javascript
Node.js Buffer用法解读
May 18 Javascript
vue实现分页栏效果
Jun 28 Javascript
Vue基本指令实例图文讲解
Feb 25 Vue.js
layer页面跳转,获取html子节点元素的值方法
Sep 27 #Javascript
使用layer模态框给新页面传值的方法
Sep 27 #Javascript
JavaScript实现随机五位数验证码
Sep 27 #Javascript
layer弹出层倒计时关闭的实现方法
Sep 27 #Javascript
layer.alert自定义关闭回调事件的方法
Sep 27 #Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
Sep 27 #Javascript
ligerUI的ligerDialog关闭刷新的方法
Sep 27 #Javascript
You might like
php smarty的预保留变量总结
2008/12/04 PHP
php class类的用法详细总结
2013/10/17 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
thinkphp框架实现数据添加和显示功能
2016/06/29 PHP
PHP中数组转换为SimpleXML教程
2019/01/27 PHP
javascript阻止浏览器后退事件防止误操作清空表单
2013/11/22 Javascript
分享JavaScript获取网页关闭与取消关闭的事件
2013/12/13 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
Bootstrap Chart组件使用教程
2016/04/28 Javascript
jQuery配合coin-slider插件制作幻灯片效果的流程解析
2016/05/13 Javascript
JS函数arguments数组获得实际传参数个数的实现方法
2016/05/28 Javascript
jquery 动态增加,减少input表单的简单方法(必看)
2016/10/12 Javascript
微信小程序 引入es6 promise
2017/04/12 Javascript
vue2 自定义动态组件所遇到的问题
2017/06/08 Javascript
ES6中的rest参数与扩展运算符详解
2017/07/18 Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
2018/02/24 Javascript
webpack项目轻松混用css module的方法
2018/06/12 Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
2019/11/20 Javascript
Python可跨平台实现获取按键的方法
2015/03/05 Python
Python中的面向对象编程详解(下)
2015/04/13 Python
仅用50行代码实现一个Python编写的计算器的教程
2015/04/17 Python
理解python正则表达式
2016/01/15 Python
matplotlib设置legend图例代码示例
2017/12/19 Python
解决Spyder中图片显示太小的问题
2018/04/27 Python
解决Tensorflow使用pip安装后没有model目录的问题
2018/06/13 Python
Django自定义用户表+自定义admin后台中的字段实例
2019/11/18 Python
YesStyle美国/全球:购买亚洲时装、美容化妆品和生活百货
2017/01/16 全球购物
八一建军节感言
2014/02/28 职场文书
新品发布会策划方案
2014/06/08 职场文书
优秀员工事迹材料
2014/12/20 职场文书
学术研讨会欢迎词
2015/01/26 职场文书
统招统分证明
2015/06/23 职场文书
儿子满月酒致辞
2015/07/29 职场文书
Nginx解决403 forbidden的完整步骤
2021/04/01 Servers
动画「半妖的夜叉姬」新BD特典图公开
2022/03/22 日漫
Win11开始菜单添加休眠选项
2022/04/19 数码科技