tomLuo

加油!努力!奋斗!

  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

写了个简单的摸拟alert提示框,欢迎大家使用.

源码下载:

https://github.com/tomlxq/jquery-confirm

效果图:

This is a demonstration. include fancybox css/js, please take care!

页面调用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");
				}});
			});
		});

single image
Figure 1. common confirm

single image
Figure 2. confirm box with layer

single image
Figure 3. error box

single image
Figure 4. success box

single image
Figure 5. warning box

posted on 2016-05-21 15:13  tomLuo  阅读(447)  评论(0编辑  收藏  举报