`
cjp1989
  • 浏览: 162163 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

Ajax异步提交登录(2)--登录使用

阅读更多
1.Ajax的原理: Ajax的原理就是:通过javascript的方式,将前台数据通过xmlhttp对象传递到后台,后台在接收到请求后,将需要的结果,再传回到前台,这样就可以实现不需要页面的转发,数据实现来回传递,从而实现页面无刷新。 基于这个原理,我想到使用Ajax传输登录的信息,包括错误信息,功能很强大,保证绝对的用户友好型。
2.使用Ajax异步提交登录可以实现功能:可以提示用户名错误,可以提示用户名正确但是密码不正确...等等一切错误信息。保证绝对的友好型。绝对的好用!!!
下面附上我的简单操作....可以任读者扩展....

	<script>
		function login(){
			var username=document.getElementById("username");
			var password=document.getElementById("password");
			if(username.value==""){
				alert("请输入用户名...");
				username.focus();
				return;
			}
			if(password.value==""){
				alert("请输入密码...");
				password.focus();
				return;
			}
			else{
				$.ajax({
					url:'login.action',
					data:'username='+username.value+'&password='+password.value+'',	
					success:function(msg){
					   var data=msg;
						if(0<data.length&&data.length<10){
							document.getElementById("msg").innerHTML='<span style="color:red;font-size:14px">'+
							data+'...<a href="#" style="color:blue;font-size:14px" onclick="location.reload()">请重新登录</a></span><br></br>';
						}else{
			document.form1.action="*****.action"			
                       document.form1.submit();
						}
					},
					error:function(){
						alert("登录验证失败...请刷新页面重新登录...");
					}
				});
			}
		}
	</script>
分享到:
评论

相关推荐

    ajax异步提交源代码

    本文将深入探讨Ajax异步提交的核心概念,并通过两个示例——一个使用纯JavaScript与Servlet交互,另一个利用Prototype JS框架与Action通信——来阐述其实现过程。 首先,让我们理解Ajax的基本原理。Ajax工作流程...

    ajax异步提交表单

    ### AJAX异步提交表单知识点解析 #### 一、AJAX技术概述 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,AJAX可以...

    from表单,生成验证码(纯数字、纯字母、数字加字母)___使用ajax异步操作--------struts版

    在生成验证码的过程中,我们可以通过AJAX异步请求服务器,获取新的验证码图片,这样可以提高用户体验,避免页面的跳转和刷新。 验证码的生成通常分为以下几个步骤: 1. **创建Action**:在Struts项目中,我们需要...

    jQuery-ajax-用户名异步请求

    这个过程可以通过Ajax调用后台接口实现,避免用户频繁提交表单进行检查。 首先,我们需要在HTML中创建一个输入框和一个按钮,用于获取用户名和触发异步请求: ```html 请输入用户名"&gt; 检查用户名 ``` 然后,我们...

    Ajax 异步回调,ajax异步提交表单,ajax异步显示

    Ajax存在问题就是在异步情况下无法控制什么时候完成记录显示,本人根据回调方法封装了个类,能够将回调方法用参数方式指定,使ajax调用结束后调用回调方法,吧内容传回。ajaxSubmitToDivCallback(显示内容div,提交...

    单纯的ajax异步提交

    单纯的ajax 异步提交共,直接调用就行了

    ajax异步提交获取信息示例

    **Ajax异步提交获取信息详解** 在Web开发中,AJAX(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。本示例主要讲解如何利用...

    Ajax异步无刷新登录实例

    综上所述,这个Ajax异步无刷新登录实例展示了如何使用C#和ASP.NET构建一个交互式的、无需页面刷新的登录系统。开发者通过学习这个实例,可以了解到如何使用Ajax技术和C#后台代码协同工作,以提升用户体验并优化Web...

    SpringMVC使用Ajax异步提交请求完成登录-附件资源

    SpringMVC使用Ajax异步提交请求完成登录-附件资源

    ajax异步提交语法源代码

    ajax的异步提交语法格式说明 源代码截图

    ssm_ajaxsubmit-ajax提交-模态对话框-ajax上传文件

    在这个项目中,“ssm_ajaxsubmit-ajax提交-模态对话框-ajax上传文件”涉及了几个关键的技术点,主要包括:Ajax异步提交、模态对话框以及文件上传。下面将详细解析这些知识点。 1. **Ajax异步提交** Ajax...

    Ajax 实现异步提交的几个实例

    本篇文章将详细探讨通过Ajax实现异步提交的几个实例,尤其是自动完成功能。 一、Ajax基础 Ajax的核心是JavaScript对象XMLHttpRequest,它允许在后台与服务器进行数据交换,而不影响用户的界面体验。创建一个Ajax...

    GridView DropDowList Ajax 异步提交

    本文将深入探讨“GridView DropDowList Ajax异步提交”的实现原理和步骤。 ### 1. GridView控件 GridView是ASP.NET中用于显示数据表格的强大控件,它可以动态地从数据库或其他数据源填充数据,并提供排序、分页、...

    异步提交 表格异步提交

    这里我们将详细探讨异步提交的核心概念、工作原理以及如何使用Ajax进行表单异步提交。 ### 1. 异步提交简介 异步提交是基于HTTP的异步通信技术,主要通过JavaScript来实现。它使得前端与后端服务器之间的数据交换...

    使用ajax实现异步提交的例子

    使用Ajax实现异步提交 &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt; 省份: (this.value)"&gt; 城市: &lt;select id="city"&gt;&lt;/select&gt; ``` 接下来,我们需要使用JavaScript(这里使用jQuery库...

    使用jQuery.form插件,实现完美的表单异步提交

    本文将详细介绍如何使用jQuery.form插件,实现完美的表单异步提交。 首先,我们需要了解jQuery.form插件的基本用法。在开始之前,请确保已经在项目中引入了jQuery库以及jQuery.form插件。通常,这两个文件可以通过...

    AJAX异步处理原理分析

    **AJAX异步处理原理分析** AJAX,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种在不刷新整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现局部...

    Ajax-magento2-ajax-cart-quick.zip

    Ajax-magento2-ajax-cart-quick.zip,magento 2 ajax购物车扩展插件提供舒适的购物体验。客户可以很容易地选择可配置的选项并在弹出窗口中编辑项目,而不会浪费重新加载页面的时间。,ajax代表异步javascript和xml。它...

    asp.net MVC2使用Ajax异步提交页面的三种方式源代码实例

    本文将详细讲解使用ASP.NET MVC2进行Ajax异步提交的三种方法,并通过源代码实例进行说明。 ### 第一种方式:原始的Ajax调用 原始的Ajax调用通常涉及创建XMLHttpRequest对象,然后手动设置请求头,发送HTTP请求,并...

Global site tag (gtag.js) - Google Analytics