jQuery实现摸拟alert提示框_jquery

页面调用JS:

    $(document).ready(function() {
      $("#delete_without_layer").click(function () {
        $.tConfirm.open({body:'Are you sure to delete?',type:'confirm',onOk:function(){
          alert("yes");
        }});
      });
      $("#delete_with_layer").click(function () {
        $.tConfirm.open({overlay:true,body:'Are you sure to delete?',type:'confirm',onOk:function(){
          alert("yes");
        }});
      });
      $("#information").click(function () {
        $.tConfirm.open({body:'This is confirm box based on fancybox!',type:'info',onOk:function(){
          alert("yes");
        }});
      });
      $("#success").click(function () {
        $.tConfirm.open({body:'Save success!',type:'success',onOk:function(){
          alert("yes");
        }});
      });
      $("#error").click(function () {
        $.tConfirm.open({body:'Some fields are wrong!',type:'error',onOk:function(){
          alert("yes");
        }});
      });   $("#warning").click(function () {
        $.tConfirm.open({body:'Someone login, it\'s not real user!',type:'warning',onOk:function(){
          alert("yes");
        }});
      });
    });

Figure 1. common confirm

Figure 2. confirm box with layer

Figure 3. error box

Figure 4. success box

Figure 5. warning box

源码下载:
https://github.com/tomlxq/jquery-confirm

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery alert、jquery alert 提示框、jquery alert插件、jquery alert 美化、jquery alert confirm,以便于您获取更多的相关知识。

时间: 2024-07-30 20:28:21

jQuery实现摸拟alert提示框_jquery的相关文章

jquery做的一个简单的屏幕锁定提示框_jquery

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

easyUI实现(alert)提示框自动关闭的实例代码_javascript技巧

原理:使用js的定时任务函数setInterval设置时间,然后触发关闭事件 参数说明 title:提示框的标题 msg:提示信息内容 ico:显示的提示信息图标,'info','warnning','error'等 函数体 function alert_autoClose(title,msg,icon){ var interval; var time=1000; var x=2; //设置时间2s $.messager.alert(title,msg,icon,function(){}); i

修改js confirm alert 提示框文字的简单实例_javascript技巧

修改js confirm alert 提示框文字的简单实例 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <style> *{padding: 0; margin: 0;} html{ height: 100%; } body{ font-size: 16px; font-family: "Microsoft Yahe

BootStrap的alert提示框的关闭后再显示怎么解决_javascript技巧

bootstrap中有alert组件,如果点击关闭按钮后该组件会被删除而不是被隐藏,想再显示怎么办呢? bootstrap-alert.js源码片段: function removeElement() { $parent .trigger('closed') .remove() } 理论上把.remove()改为.hide(),然后在需要重新显示的地方,加上$('#alert').show();就可以了. 但实际应用中,可以把 close button 的 data-dismiss 去掉,加上

jquery实现邮箱自动填充提示功能_jquery

邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作为账号名 为了提高用户的体验,很多网站都会实现邮箱输入的自动提示功能,所有自己也实现了一个,先看下效果吧,觉得效果还行的就拿去 核心代码(需要jquery的支持): (function($){ $.fn.mailAutoComplete = function(options){ var defaults = { boxClass: "mailListBox", //外部box样式 listClass: "

jQuery实现多级联动下拉列表查询框_jquery

本文实例介绍了jQuery实现多级联动下拉列表查询框的详细代码,分享给大家供大家参考,具体内容如下  效果图: 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title></title> <meta name="keywords" content

jQuery插件EnPlaceholder实现输入框提示文字_jquery

用法: 首先在head中分别引入jQuery及本插件 <script type="text/javascript" src="jquery-1.7.2.min.js">script> <script type="text/javascript" src="jquery.enplaceholder.js">script> 然后就可以调用鸟 //通过value模拟placeholder $('i

基于jquery+thickbox仿校内登录注册框_jquery

下面将我用thickbox和css实现校内登录(注册)框与大家分享下----->效果图如下: 方法很简单,就是用thickbox的iframe模式,将另一个页面嵌套即可,然后在这个页面里写ajax来实现相应的功能. 代码: 注册:regUser.html 复制代码 代码如下: <link type="text/css" href="css/reg.css" rel="Stylesheet" /> <script type=

PHP 实现类似js中alert() 提示框_php实例

主要应用于添加判断提示,跳转,返回,刷新. 复制代码 代码如下: /**  * JS提示跳转  * @param  $tip  弹窗口提示信息(为空没有提示)  * @param  $type 设置类型 close = 关闭 ,back=返回 ,refresh=提示重载,jump提示并跳转url  * @param  $url  跳转url  */ function alert($tip = "", $type = "", $url = "")