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和注册表脚本实现右键收藏Web页选中文本
Jan 28 Javascript
浅析JQuery UI Dialog的样式设置问题
Dec 18 Javascript
jQuery中DOM操作实例分析
Jan 23 Javascript
分享两款带遮罩的jQuery弹出框
Dec 30 Javascript
jquery采用oop模式class类的使用示例
Jan 22 Javascript
底部悬浮通栏可以关闭广告位的实现方法
Jun 01 Javascript
浅析$.getJSON异步请求和同步请求
Jun 06 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
Mar 06 Javascript
vue打包相关细节整理(小结)
Sep 28 Javascript
微信小程序开发问题之wx.previewImage
Dec 25 Javascript
JS正则表达式验证密码强度
Mar 18 Javascript
详解vue-router的导航钩子(导航守卫)
Nov 02 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
百事可乐也出咖啡了 双倍咖啡因双倍快乐
2021/03/03 咖啡文化
php 动态添加记录
2009/03/10 PHP
遭遇php的in_array低性能问题
2013/09/17 PHP
php实现的网页版剪刀石头布游戏示例
2016/11/25 PHP
PHP实现微信JS-SDK接口选择相册及拍照并上传的方法
2016/12/05 PHP
PHP语言对接抖音快手小红书视频/图片去水印API接口源码
2020/08/11 PHP
window.open被浏览器拦截后的自定义提示效果代码
2007/11/19 Javascript
JQuery表单验证插件EasyValidator用法分析
2014/11/15 Javascript
js实现新年倒计时效果
2015/12/10 Javascript
浅析jQuery中使用$所引发的问题
2016/05/29 Javascript
jQuery基础知识点总结(DOM操作)
2016/06/01 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
2017/03/07 Javascript
详解vue-router 2.0 常用基础知识点之router-link
2017/05/10 Javascript
JS通过调用微信API实现微信支付功能的方法示例
2017/06/29 Javascript
关于JavaScript中的this指向问题总结篇
2017/07/23 Javascript
addeventlistener监听scroll跟touch(实例讲解)
2017/08/04 Javascript
js微信应用场景之微信音乐相册案例分享
2017/08/11 Javascript
微信小程序中使用Promise进行异步流程处理的实例详解
2017/08/17 Javascript
JS实现前端缓存的方法
2017/09/21 Javascript
jQuery.Sumoselect插件实现下拉复选框效果
2017/11/09 jQuery
浅谈vue-router 路由传参的方法
2017/12/27 Javascript
原生JS实现的自动轮播图功能详解
2018/12/28 Javascript
使用Vue.set()方法实现响应式修改数组数据步骤
2019/11/09 Javascript
python实现决策树C4.5算法详解(在ID3基础上改进)
2017/05/31 Python
Python实现二维数组输出为图片
2018/04/03 Python
django中ORM模型常用的字段的使用方法
2019/03/05 Python
Python-numpy实现灰度图像的分块和合并方式
2020/01/09 Python
matplotlib.pyplot.matshow 矩阵可视化实例
2020/06/16 Python
Python configparser模块应用过程解析
2020/08/14 Python
HTML5+CSS3实例 :canvas 模拟实现电子彩票刮刮乐代码
2016/12/30 HTML / CSS
详解WebSocket跨域问题解决
2018/08/06 HTML / CSS
Derek Rose官网:英国高档睡衣、家居服和内衣品牌
2020/01/18 全球购物
中学生团员自我评价分享
2013/12/07 职场文书
男女朋友协议书
2014/04/23 职场文书
保证书格式范文
2014/04/28 职场文书
部门经理迟到检讨书
2015/02/16 职场文书