注:在学校平时做的小项目跳页都是用 Response.Write写脚本弹窗并跳页,每次点击登录成功,注册成功......然后点击确定,太麻烦了,这次的项目老师说让用这个插件,所以就简单搞了一下!

实现效果:当点击登录时,通过异步和数据库连接查询,如果成功,弹出成功提示几秒,然后再自动跳页,如果登录失败,直接提示登录失败,因为很简单,所以就直接写代码了,就当简单复习一下啦!哈哈

先引入三个链接:如下(直接去网上下载就行)

<link href="toastr.css" rel="stylesheet" />
<script src="jquery.min.js"></script>
<script src="toastr.js"></script>

HTML页面:因为举例子,就直接放一些个服务器空间的按钮,没有放<input type="button">的原因是因为在用服务器控件实现的时候,遇到了一些问题,然后解决了一下

<asp:Button ID="success" runat="server" Text="Button" />
<asp:Button ID="info" runat="server" Text="Button" />
<asp:Button ID="warning" runat="server" Text="Button" />
<asp:Button ID="error" runat="server" Text="Button" />
<asp:Button ID="Button1" runat="server" Text="登录"/>   就用这个按钮吧!
<input type="button" name="clear" id="clear" value="清除" />

JavaScript代码:

<script>
$(function () {
toastr.options = {
"closeButton": false,
"debug": false,
"positionClass": "toast-top-right",
"onclick": null,
"showDuration": "",
"hideDuration": "",
"timeOut": "",
"extendedTimeOut": "",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
};
$("#success").click(function () { toastr.success("祝贺你成功了");
return false; })
//信息提示绑定 $("#info").click(function () {
toastr.info("这是一个提示信息");
return false;
}) $("#warning").click(function () { toastr.warning("警告你别来烦我了");
return false;
}) $("#error").click(function () { toastr.error("出现错误,请更改");
return false;
}) $("#clear").click(function () { toastr.clear(); })
$("#Button1").click(function () {
$.get("Handler.ashx", {}, function (data) { if (data == "true") {
toastr.success("祝贺你成功了"); setTimeout(function () {
window.location.href = "Default.aspx";
}, )
return false;
}
else {
toastr.error("出现错误,请更改");
}
})
return false;
})
})
</script>

到这里就结束啦!希望大神们给我指点指点,修改修改,感激不尽!

jQuery toastr提示简单实现的更多相关文章

  1. Jquery toastr提示框

    toastr是一个基于JQuery的消息提示插件; 1. 下载toastr和jquery https://jquery.com/download/ https://codeseven.github.i ...

  2. 漂亮灵活设置的jquery通知提示插件toastr

    toastr是一款非常棒的基于jquery库的非阻塞通知提示插件,toastr可设定四种通知模式:成功,出错,警告,提示,而提示窗口的位置,动画效果都可以通过能数来设置,在官方站可以通过勾选参数来生成 ...

  3. jquery toastr introduction

    1.资源 http://www.jq22.com/jquery-info476 http://www.jq22.com/yanshi476 Nuget Install-Package toastr 官 ...

  4. Eclipse安装插件支持jQuery智能提示

    Eclipse安装插件支持jQuery智能提示 最近工作中用到jQuery插件,需要安装eclipse插件才能支持jQuery智能提示,在网上搜索了一下,常用的有三个插件支持jQuery的智能提示:1 ...

  5. 几个 jQuery 小提示和技巧

    几个 jQuery 小提示和技巧 今天,我们将分享一些很有用的技巧和窍门给 jQuery 开发人员.jQuery 是最好的 JavaScript 库之一,用于简化动画,事件处理,支持 Ajax 和 H ...

  6. 让你的MyEclipse具有jquery自动提示

    想让你的MyEclipse支持Jquery的自动提示更简单一些,照下图完成即可:      照上面图示已经完成了Jquery自动提示的配置,此时spket已经有两种AJAX库的自动提示,通过右边的De ...

  7. MyEclipse jQuery智能 提示

    jQuery智能 MyEclipse Spket IDE 1.6.23 http://www.spket.com/download.html Plugin 1.6.23 5.62 MB Minimum ...

  8. Angular toastr提示框

    1. 安装ngx-toastr包 npm install ngx-toastr --save 2. package.json中引入toastr样式文件 "styles": [&qu ...

  9. 基于jquery的提示框JavaScript 插件,类Bootstrap

    目录 基于jquery的提示框JavaScript 插件,类Bootstrap 基于jquery的提示框JavaScript 插件,类Bootstrap 源码 github地址: https://gi ...

随机推荐

  1. CentOS7上部署taiga项目管理软件

    作者:waringid 一.简介 Taiga 是一个免费开源,而且功能非常强大的项目管理平台,用于初创企业和敏捷开发团队.提供一个简单.漂亮的项目管理工具.Taiga 采用 Python Django ...

  2. 二阶环路滤波器的matlab 设计

    clc; Rs=10*10^6; %码速率 es=0.707; %阻尼系数 fs=8*10^6; %采样频率.系统时钟频率 Bit_Loop_out=27;%环路滤波器输入输出位宽 N=31; %NC ...

  3. 【python】实用的logging封装

    #!/usr/bin/python import logging import logging.handlers def set_logger(filename, logmod): log_size ...

  4. Git使用七:修改最后一次提交、删除文件和重命名文件

    修改最后一次提交: 在实际开发中,可能会遇到以下两种情景:情景一:版本刚一提交(commit)到仓库,突然想起漏掉两个文件还没有添加(add).情景二:版本刚一提交(commit)到仓库,突然想起版本 ...

  5. php无限极分类方法

    仅供参考: //控制器 $data = M('category')->select(); $datas = D('Category')->_getTree($data, 0,0,TRUE) ...

  6. 期货大赛项目|五,表格插件datatatables在MVC中的应用

    系统中都需要表格,我见过最好的表格就是Datatables了,但中文文档有限,英文能力有限,就写一些简单用法 上图看效果先 要了分页和排序 基本用法 引入js和css bundles.Add(new ...

  7. 一起学HBase——简单介绍HBase各种组件

    HBase是谷歌BigTble的开源实现.谷歌的三篇论文拉开了大数据江湖的序幕,铸就了现在以Hadoop为主的大数据技术生态圈.而HBase是开源的大数据数据库,和传统的行式数据库不同的是,HBase ...

  8. jsonwebtoken收藏博客地址

    这个东西也不是很懂,但是查了一下资料,大概知道是什么了,具体要怎么嵌套到具体自己需要实现的功能里面,这个跨度还是有点大, 先把博客地址给收藏了. 这里是Java版示例 简书参考 js示例 github ...

  9. npm的一些常用命令(在国内,建议使用cnpm,在淘宝镜像里面下载就行)

    npm的一些常用命令(在国内,npm操作可能会比较慢,建议使用cnpm,在淘宝镜像里面下载就行,用法和npm一样) cnpm安装地址,直接安装 npm install cnpm -g --regist ...

  10. (转)RBAC权限管理

    RBAC 模型作为目前最为广泛接受的权限模型 角色访问控制(RBAC)引入了Role的概念,目的是为了隔离User(即动作主体,Subject)与Privilege(权限,表示对Resource的一个 ...