UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

jQuery手机端弹出框插件popups.js

所属分类：UI-弹出层

 58496  342  查看评论 (11)
分享到微信朋友圈
X
jQuery手机端弹出框插件popups.js ie兼容10
 查看演示  立即下载 
/*toast*/
$('#demo1').click(function() {
    jqtoast('你点击了toast')
})
/*alert*/
$('#demo2').click(function() {
    jqalert({
        title: '提示',
        content: '自定义弹窗内容，居左对齐显示，告知需要确认的信息等'
    })
})
/*confirm*/
$('#demo3').click(function() {
    jqalert({
        title: '提示',
        content: '自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
        yestext: '知道了',
        notext: '取消'
    })
})
/*prompt*/
$('#demo4').click(function() {
    jqalert({
        title: '提示',
        prompt: '请问你叫什么名字?',
        yestext: '提交',
        notext: '取消',
        yesfn: function() {
            jqtoast('提交成功');
        },
        nofn: function() {
            jqtoast('你点击了取消');
        }
    })
})
/*点击按钮跳转*/
$('#demo5').click(function() {
    jqalert({
        title: '提示',
        content: '自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
        yeslink: 'https://www.baidu.com/'
    })
})
/*取消默认点击背景消失*/
$('#demo6').click(function() {
    jqalert({
        title: '提示',
        content: '自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
        click_bg: false
    })
})
相关插件-弹出层
查看更多

超简单实用的弹窗jquery插件

 兼容到ie8，简洁，实用，美观，可以自由更改弹窗样式。可以在弹窗中加上ajax请求的数据！
  弹出层
 103489  451

jQuery html5爆裂式登录效果

 HTML5爆裂式关闭窗口动画登录模板，关闭窗口撕开动画效果。
  弹出层
 54909  576

jQuery弹出层插件

 可无限次弹出，自己设置大小，手动调整大小都可（相比于layer.js要轻量）
  弹出层
 41698  319

四种简单弹窗 — 自己配置弹窗

 四种弹出方式，可以非常简单的通过修改css来定义自己喜欢的样式。
  弹出层
 55429  423

讨论这个项目（11）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    用户5566251159 0
    2020/1/8 15:24:13
    安卓 用到项目里 输入字的话 弹框被拉长了怎么办 回复
    天之蓝 1
    2019/5/16 20:36:32

    如果输入框需要增加非空判断，可将 popups.js 的 prompt 部分改成如下代码：

    if (prompt) {
    $(document).delegate('#yes_btn', 'click', function() {
        let value = $('.prompt-text').val();
        if (value == '') {
            jqtoast('内容不能为空');
            return;
        }
        setTimeout(function() {
            al.remove();
        }, 300);
        if (yesfn) {
            param.yesfn();
            yesfn = '';
        }
        param = {};
    });
} else {
    $(document).delegate('#yes_btn', 'click', function() {
        setTimeout(function() {
            al.remove();
        }, 300);
        if (yesfn) {
            param.yesfn();
            yesfn = '';
        }
        param = {};
    });
}
    回复
    L 0
    2019/2/23 16:59:42
    IOS上弹框出不来怎么破 回复
    korb 0
    2018/12/31 10:26:42
    prompt 输入的内容 怎么 接收? ？？ 一脸懵
        你的智商难道拿去买萌了嘛0
        2019/1/8 18:18:51
        知道怎么解决了吗大佬，我也碰到过这个问题了
        ?向风Lin?0
        2019/3/20 19:57:22
        怎么获取值？
        你之跫音，乃心之回响1
        2019/4/15 14:50:55
        获取值的方法：
        var value = $('.prompt-text').val();
    回复
    chenrry 0
    2018/7/13 9:16:32

    confirm弹窗，点击取消，确认事件就不能再点了

        杨xx0
        2018/7/18 16:18:42
        测试！
        share1301
        2018/10/18 15:27:14

        找到了解决方法了, popup.js 脚本中的,cancel标签 位置的param = {}; 去掉就解决啦

        al.on('click', '[data-role="cancel"]', function() {
    al.remove();
    if (nofn) {
        param.nofn();
        nofn = '';
    }
    //param = {};
});
        学海无涯0
        2019/6/25 9:30:20

        把这里的定时器去掉就行了，63行附近

        $(document).delegate('#yes_btn', 'click', function() {
    //setTimeout(function () {
    al.remove();
    //},300);
    if (yesfn) {
        param.yesfn();
        yesfn = '';
    }
    param = {};
});
    回复
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复