jQuery toastr提示简单实现
注:在学校平时做的小项目跳页都是用 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提示简单实现的更多相关文章
- Jquery toastr提示框
toastr是一个基于JQuery的消息提示插件; 1. 下载toastr和jquery https://jquery.com/download/ https://codeseven.github.i ...
- 漂亮灵活设置的jquery通知提示插件toastr
toastr是一款非常棒的基于jquery库的非阻塞通知提示插件,toastr可设定四种通知模式:成功,出错,警告,提示,而提示窗口的位置,动画效果都可以通过能数来设置,在官方站可以通过勾选参数来生成 ...
- jquery toastr introduction
1.资源 http://www.jq22.com/jquery-info476 http://www.jq22.com/yanshi476 Nuget Install-Package toastr 官 ...
- Eclipse安装插件支持jQuery智能提示
Eclipse安装插件支持jQuery智能提示 最近工作中用到jQuery插件,需要安装eclipse插件才能支持jQuery智能提示,在网上搜索了一下,常用的有三个插件支持jQuery的智能提示:1 ...
- 几个 jQuery 小提示和技巧
几个 jQuery 小提示和技巧 今天,我们将分享一些很有用的技巧和窍门给 jQuery 开发人员.jQuery 是最好的 JavaScript 库之一,用于简化动画,事件处理,支持 Ajax 和 H ...
- 让你的MyEclipse具有jquery自动提示
想让你的MyEclipse支持Jquery的自动提示更简单一些,照下图完成即可: 照上面图示已经完成了Jquery自动提示的配置,此时spket已经有两种AJAX库的自动提示,通过右边的De ...
- MyEclipse jQuery智能 提示
jQuery智能 MyEclipse Spket IDE 1.6.23 http://www.spket.com/download.html Plugin 1.6.23 5.62 MB Minimum ...
- Angular toastr提示框
1. 安装ngx-toastr包 npm install ngx-toastr --save 2. package.json中引入toastr样式文件 "styles": [&qu ...
- 基于jquery的提示框JavaScript 插件,类Bootstrap
目录 基于jquery的提示框JavaScript 插件,类Bootstrap 基于jquery的提示框JavaScript 插件,类Bootstrap 源码 github地址: https://gi ...
随机推荐
- vertx实例的fileSystem文件系统模块
初始化 //根据OS区分实现 System.getProperty("os.name").toLowerCase(); Utils.isWindows() ? new Window ...
- django admin 修改批量操作内容
@admin.register(Template) class TemplateAdmin(admin.ModelAdmin): list_display = ( 'cn_title', 'start ...
- 爬虫框架 Scrapy
一 介绍 crapy一个开源和协作的框架,其最初是为了页面抓取 (更确切来说, 网络抓取 )所设计的,使用它可以以快速.简单.可扩展的方式从网站中提取所需的数据.但目前Scrapy的用途十分广泛,可用 ...
- ASP.NET 多环境下配置文件web.config的灵活配置
调试,发布Asp.net程序的时候,开发环境和发布环境的Web.Config往往不同,比如connectionstring等.如果常常有调试,发布的需求,就需要常常修改web.config文件,这往往 ...
- ios 运行时特征,动态改变控件字体大小
需求:ex: 在不同尺寸的iPhone上面显示的字体大小不一样 https://github.com/rentzsch/jrswizzle #import <UIKit/UIKit.h> ...
- SQL反模式学习笔记22 伪键洁癖,整理数据
目标:整理数据,使不连续的主键Id数据记录变的连续. 反模式:填充断档的数据空缺. 1.不按照顺序分配编号 在插入新行时,通过遍历表,找到的第一个未分配的主键编号分配给新行,来代替原来自动分配的伪主键 ...
- Docker 学习1 容器技术基础入门
一.虚拟化 1.主机级别虚拟化(两种) a.类型一虚拟化:在硬件上直接安装hyper-ver,然后再安装虚拟机 1).操作系统就两棵树:进程树,文件系统树. 2).一个内核只能有一个root b.类型 ...
- Servlet(七):session
Session 学习:问题: Request 对象解决了一次请求内的不同 Servlet 的数据共享问 题,那么一个用户的不同请求的处理需要使用相同的数据怎么办呢?解决: 使用 session 技术. ...
- 如何在 code blocks中使用 mkl库
为了安装caffe, 所以安装了mkl, 现在想在codeblock的项目中使用mkl. 设置mkl环境变量: mkl安装好后默认是在/opt/intel/mkl中,其中/opt/intel/mkl/ ...
- C# ToString()和Convert.ToString()的区别【转】
一.一般用法说明 ToString()是Object的扩展方法,所以都有ToString()方法;而Convert.ToString(param)(其中param参数的数据类型可以是各种基本数据类型, ...