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 相关文章推荐
谈谈关于JavaScript 中的 MVC 模式
Apr 11 Javascript
js 窗口抖动示例
Sep 04 Javascript
js获得页面的高度和宽度的方法
Feb 23 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
将input框中输入内容显示在相应的div中【三种方法可选】
May 08 Javascript
微信小程序实现滑动删除效果
May 19 Javascript
JQuery 又谈ajax局部刷新
Nov 27 jQuery
jQuery利用FormData上传文件实现批量上传
Dec 04 jQuery
详解React 服务端渲染方案完美的解决方案
Dec 14 Javascript
微信小程序实现文字跑马灯
May 26 Javascript
仿照Element-ui实现一个简易的$message方法
Sep 14 Javascript
使用node-media-server搭建一个简易的流媒体服务器
Jan 20 Javascript
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+SQL 注入攻击的技术实现以及预防办法
2010/12/29 PHP
PHP压缩html网页代码(清除空格,换行符,制表符,注释标记)
2012/04/02 PHP
php根据年月获取季度的方法
2014/03/31 PHP
详解PHP中的状态模式编程
2015/08/11 PHP
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
ThinkPHP5框架缓存查询操作分析
2018/05/30 PHP
PHP实现无限极分类的两种方式示例【递归和引用方式】
2019/03/25 PHP
linux mint下安装phpstorm2020包括JDK部分的教程详解
2020/09/17 PHP
Jquery 模板数据绑定插件的使用方法详解
2013/07/08 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
2014/03/05 Javascript
js使用split函数按照多个字符对字符串进行分割的方法
2015/03/20 Javascript
文字垂直滚动之javascript代码
2015/07/29 Javascript
Vuejs第十二篇之动态组件全面解析
2016/09/09 Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
2017/04/07 jQuery
vue+axios实现登录拦截的实例代码
2017/05/22 Javascript
Node.js开发第三方微信公众平台
2017/06/05 Javascript
快速理解 JavaScript 中的 LHS 和 RHS 查询的用法
2017/08/24 Javascript
通过Nodejs搭建网站简单实现注册登录流程
2019/06/14 NodeJs
python编程开发之类型转换convert实例分析
2015/11/13 Python
Python 自动刷博客浏览量实例代码
2017/06/14 Python
python机器学习之神经网络(三)
2017/12/20 Python
Python 输出时去掉列表元组外面的方括号与圆括号的方法
2018/12/24 Python
django项目简单调取百度翻译接口的方法
2019/08/06 Python
Python如何将函数值赋给变量
2020/04/28 Python
Python 中如何写注释
2020/08/28 Python
详解如何使用CSS3中的结构伪类选择器和伪元素选择器
2020/01/06 HTML / CSS
html5使用canvas绘制文字特效
2014/12/15 HTML / CSS
印度尼西亚综合购物网站:Lazada印尼
2016/09/07 全球购物
Myprotein荷兰官网:欧洲第一运动营养品牌
2020/07/11 全球购物
委托协议书范本
2014/04/22 职场文书
个人查摆问题及整改措施
2014/10/16 职场文书
服务整改报告
2014/11/06 职场文书
2014年会计工作总结
2014/11/27 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python
Python如何识别银行卡卡号?
2021/06/10 Python
实战Python爬虫爬取酷我音乐
2022/04/11 Python