素材牛VIP会员

简单实用的jQuery提示框对话框美化插件(支持alert、confirm和toast)

 所属分类:网页特效-对话框/灯箱/提示,悬浮层/弹出层,弹窗

 浏览:730次  评论:1次  更新时间:2023-06-24
牛币素材VIP可免积分下载
简单实用的jQuery提示框对话框美化插件(支持alert、confirm和toast)
积分说明:注册即送10牛币,每日签到可获得5牛币,成为VIP会员可永久免牛币下载!   充值积分   充值会员   更多说明»
素材描述:一个基于jQuery的提示框美化插件,可以支持alert、confirm和toast的提示框,即使没有刷新页面,多次使用也不会重复出现多个提示框。
 标签:对话框提示框

详细介绍

使用方法

1、引入jquery ;

2、引入Fytx_Tips.css ;

3、引入Fytx_Tips_Config.js , 打开这个文件可修改弹出框的颜色;

4、引入Fytx_Tips.js ;

5、弹出 alert 框方法:

调用函数:

$.alert("标题","内容");

6、弹出 confirm 框方法:

调用函数:$.confirm("标题","内容","确定按钮传递参数(可选)","取消按钮传递参数(可选)");

回调函数:(不需要回调时,可以省略回调函数)

$.isok() 或 $.isok("确定按钮传递参数");

$.iscancel() 或 $.iscancel("取消按钮传递参数");

例如:

弹出confirm框,点击确定回调 $.isok() , 点击取消回调 $.iscancel()

$("#confirmbtn").click(function(){
    $.confirm("提示信息","这个是弹出confirm框!");
});
$.isok=function(){
    alert("点击了确定按钮!");
}
$.iscancel=function(){
    alert("点击了取消按钮!");
}

弹出confirm框,点击确定回调 $.isok(ok) , 点击取消回调 $.iscancel(cancel)

$("#confirmbtn").click(function(){
    $.confirm("提示信息","这个是弹出confirm框!","这是确定按钮传递参数","这是取消按钮传递参数");
});
$.isok=function(ok){
    alert(ok);
}
$.iscancel=function(cancel){
    alert(cancel);
}

7、弹出 toast 框方法:

调用函数:$.toast("内容","弹出框自动关闭时间(整型)默认值为3","弹出框是否可点击关闭(布尔型)");

例如:

$.toast("内容",5,true);     弹出toast框5秒后自动关闭,在关闭之前也可以点击弹出框直接关闭;

$.toast("内容",5,false);     弹出toast框5秒后自动关闭,在自动关闭之前点击弹出框也不会关闭;

$.toast("内容",0);     弹出toast框不会关闭,刷新页面或调用$.removetoast()进行关闭;

文件目录结构

  • ┝ Fytx_Tips.css
  • ┝ Fytx_Tips.js
  • ┝ Fytx_Tips_Config.js
  • ┝ index.html
  • ┝ jquery.min.js

相关素材 - 对话框/灯箱/提示,悬浮层/弹出层,弹窗

讨论这个素材(1)回答他人问题或分享使用心得会奖励牛币

ha***ok  
2023年06月26日

试试看!

回复
 文明上网,理性发言!   😉 阿里云幸运券,戳我领取
我的牛币余额:0
所需牛币:10 开始下载

牛币获取:签到、评论、充值    » 在线充值(10牛币=1元)