`

artDialog使用

 
阅读更多

1,下载artDialog

2,在JSP里面引入。

3,使用。

 

相关JSP代码如下:

这里是通过使用artDialog来弹出一个登陆框,在通过AJAX来与后台交互。

 

 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>artDialog登陆测试</title>
    
	<script type="text/javascript" src="<%=basePath%>artDialog/artDialog.js?skin=blue"></script>
	<script type="text/javascript" src="<%=basePath%>artDialog/artDialog.js"></script>
	<script type="text/javascript">
		function test(){
		
			
		art.dialog({
    
    title: '登录',//标题
    content: '帐号:<input id="login-na" type="text" value="guest" />'
        + '<br />密码:<input id="login-pw" type="text" value="333" />',
    initialize: function () {
        document.getElementById('login-na').focus();
        
    },
    lock: true,//锁屏
    
    fixed: true,//可以拖动
    ok: function () {
        var pwd = document.getElementById('login-pw').value;
        var name = document.getElementById('login-na').value;
       
        
       	//执行登录的ajax
       	$.ajax({
		    url: 'AjaxTest.action?name='+name+'&pwd='+pwd,
		    success: function (data) {
		    
		    	if(data==1){
		    	//如果登录错误
		    			art.dialog({
						    content: '用户名或密码错误',
						    time:2
						});
						
		    	} else {
					window.location.reload();//登录成功,重新刷新页面 或者 window.location.href="xx.action";		    	
		    	}
		    },
		    
		});
       	
       	
       	
        return false;//保持登录款不消失
    },
    okValue: '登录',//登录按钮的名称
    cancel: function () {
    	alert('取消登录')
    }
});
		
		}
	</script>
  </head>
  
  <body>
    <a onclick="test();" href="javascript:;">登录</a>
  </body>
</html>

 

 

 

 

分享到:
评论

相关推荐

    artdialog

    NULL 博文链接:https://wang371134086.iteye.com/blog/1563843

    artDialog插件和API详解

    artDialog插件的使用和相关API详解

    artDialog,demo,iframe

    自己写的一些小例子,代码清晰明了易懂, 使用json格式交互,套用artDialog漂亮的窗口, 使用SSH框架

    artdialog的使用实例

    artdialog效果很不多,上传上来大家都可以试试~!

    artdialog4.1.5

    artdialog4.1.5 另附使用方法,http://blog.csdn.net/weinierbian/article/details/7566459

    artDialog4.0.5

    artDialog的特殊UI框架能够适应内容变化,因此你不必去考虑消息内容尺寸使用它。当然它仍然可以接受一个固定高宽的参数,它能够防止内容溢出或截断,同时也不会产生难看的滚动条;它的消息容器甚至能够根据宽度让...

    artDialog 5.0.1

    artDialog 是一个设计得十分巧妙的对话框组件,小巧身材却拥有丰富的接口与漂亮的外观。可以独立使用,也可以集成在jQuery里,小巧,灵活,功能强大。本附件是2012-10-30下载于github,最近更新日期为2012-6.

    artDialog源码以及封装、实例

    artDialog的JS源码,有一个弹出框的简单封装,以及运行实例

    漂亮的对话框artDialog5 具有10种风格,使用简单

    artDialog 是一个设计得十分巧妙的对话框组件,小巧身材却拥有丰富的接口与漂亮的外观。 自适应内容 优雅的接口 细致的体验 跨平台兼容 具有10种风格,使用简单

    javascript artdialog 4.1.0

    artDialog是一个精巧的web对话框组件,压缩后只有十多KB,并且不依赖其他框架。 新增"blue"皮肤;调整内部结构,取消模板解析机制,【tmpl参数不能再使用】

    自定义window.alert对话框JS代码

    非常不错的JS特效。一个自定义样式的alert弹出对话框。比系统默认的美观许多。

    artDialog-6

    artDialog-6, 一个不错的dialog的UI组件。 基 于jquery 1.10.2的脚本库. 在平常的开发中使用。

    artDialog对话框

    artDialog对话框,有不同的皮肤,以及文档,使用起来十分方便.

    jQuery插件artDialog.js使用与关闭方法示例

    主要介绍了jQuery插件artDialog.js使用与关闭方法,结合具体实例形式分析了jQuery弹出窗口插件artDialog.js的简单使用方法及相关注意事项,需要的朋友可以参考下

    artDialog_Demo

    28、对于简单的消息可以使用简写: artDialog('hello world') 29、让IE6支持覆盖下拉控件的同时也支持透明皮肤 30、优化锁屏渐变动画 31、修复范围限制函数没有生效的错误 32、修复一处笔误,忘记声明变量导致...

    requireArtDialog:使用requirejs加载artdialog,这里使用avalon.js。 可以更改为requirejs

    requireArtDialogload artdialog used requirejs使用requirejs加载artdialog示例这里使用的是avalonjs。可自行更改为requirejs

    artDialog弹出框

    artDialog是开源前端弹出框,使用简单方便,是web快速开发弹出框利器

    弹出框artDialog4.1.6.zip

    完美的弹出框jquery插件,很实用!只要引用好文件,就可以方便快捷的使用!并且存在各种样式!已应用到自己做的项目当中使用

    不错的JS弹出对话框插件 artDialog

    不错的JS弹出对话框插件 artDialog,内置强大使用示例与API,使用简单方便,兼容当前主流浏览器

Global site tag (gtag.js) - Google Analytics