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 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
Jun 21 Javascript
js中confirm实现执行操作前弹出确认框的方法
Nov 01 Javascript
DOM基础教程之事件对象
Jan 20 Javascript
JS中prototype的用法实例分析
Mar 19 Javascript
js实现类似新浪微博首页内容渐显效果的方法
Apr 10 Javascript
JS实现将数字金额转换为大写人民币汉字的方法
Aug 02 Javascript
vue移动端裁剪图片结合插件Cropper的使用实例代码
Jul 10 Javascript
jQuery实现键盘回车搜索功能
Jul 25 jQuery
详解angular2如何手动点击特定元素上的点击事件
Oct 16 Javascript
vue的keep-alive中使用EventBus的方法
Apr 23 Javascript
微信小程序实现图片上传
May 23 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知道与问问的采集插件代码
2010/10/12 PHP
thinkphp中AJAX返回ajaxReturn()方法分析
2016/12/06 PHP
thinkPHP中钩子的使用方法实例分析
2017/11/16 PHP
[HTML/CSS/Javascript]WWTJS
2007/09/25 Javascript
使用js如何实现全选与全不选
2013/12/30 Javascript
jQuery实现页面滚动时动态加载内容的方法
2015/03/20 Javascript
详解JavaScript中jQuery和Ajax以及JSONP的联合使用
2015/08/13 Javascript
jQuery调用WebMethod(PageMethod) NET2.0的方法
2016/04/15 Javascript
jQuery Ajax前后端使用JSON进行交互示例
2017/03/17 Javascript
jQuery Tree Multiselect使用详解
2017/05/02 jQuery
Node.js+Express+MySql实现用户登录注册功能
2017/07/10 Javascript
微信通过页面(H5)直接打开本地app的解决方法
2017/09/09 Javascript
js html实现计算器功能
2018/11/13 Javascript
详解angularjs4部署文件过大解决过程
2018/12/05 Javascript
微信小程序bindtap事件与冒泡阻止详解
2019/08/08 Javascript
Nginx搭建HTTPS服务器和强制使用HTTPS访问的方法
2015/08/16 Python
快速了解Python开发中的cookie及简单代码示例
2018/01/17 Python
python寻找list中最大值、最小值并返回其所在位置的方法
2018/06/27 Python
使用python接入微信聊天机器人
2020/03/31 Python
Python之——生成动态路由轨迹图的实例
2019/11/22 Python
基于pygame实现童年掌机打砖块游戏
2020/02/25 Python
Python函数必须先定义,后调用说明(函数调用函数例外)
2020/06/02 Python
CSS3之多背景background使用示例
2013/10/18 HTML / CSS
使用html2canvas.js实现页面截图并显示或上传的示例代码
2018/12/18 HTML / CSS
Boden澳大利亚官网:英国在线服装公司
2018/08/05 全球购物
Under Armour安德玛英国官网:美国高端运动科技品牌
2018/09/17 全球购物
怎样在 Applet 中建立自己的菜单(MenuBar/Menu)?
2012/06/20 面试题
深圳茁壮笔试题
2015/05/28 面试题
关于安全的演讲稿
2014/05/09 职场文书
机械机修工岗位职责
2014/08/03 职场文书
教师民族团结演讲稿
2014/08/27 职场文书
二十年同学聚会致辞
2015/07/28 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python
python自动统计zabbix系统监控覆盖率的示例代码
2021/04/03 Python
详解PHP Swoole与TCP三次握手
2021/05/27 PHP
详解nginx安装过程并代理下载服务器文件
2022/02/12 Servers