前面介绍了《jquery+ajax注册实时验证》及《jQuery使用$.ajax进行即时验证的方法》。这里进一步总结了jQuery的Ajax用户认证和注册技术。分享给大家供大家参考，具体如下：
Ajax 表单提交是一个功能强大的技术，提供一种发送 web 表单的方法，无需重载浏览器窗口。jQuery 库让您使用 Ajax 表单提交功能进一步提供一个方便快捷的方法，以少量代码生成可用 Ajax 的 Web 表单。在本文中，学习如何使用 jQuery 创建基础 Ajax 表单提交，以及如何使用该技术验证一个用户。本文使用 jQuery 演示了 Ajax 用户注册技术，比如，检查用户名可用性，以及当选择的用户名已存在时提示用户名。既不需要表单提交也无需页面重载。
如果您对 jQuery 不是很熟悉，它本质上是一个 JavaScript 库，使 JavaScript 开发变得很容易。它使所需的代码量最小化，因为它有许多内置功能，这样您就不再需要为这些功能编写客户端函数或对象了。更多信息和下载 jQuery 库的链接，可参见本站相关资料；或者，如您在所有代码样例中看到的那样，可以直接嵌入 jQuery 库的当前版本。
使用 jQuery 进行表单提交
无需重载即可提交一个表单在很多场景中都是很有用的。例如，有了它，您就可以在提交表单之前使用 JavaScript 代码验证表单字段，来在一个单页面应用程序中提交表单或者 — 如本文所示— 确定是否用户名已经注册过。使用 jQuery 触发一个表单提交有两种方法：使用 submit 处理函数或 click 处理函数。清单 1 显示了如何使用 submit 处理函数提交一个表单。
清单 1. 使用 jQuery 的 submit 处理函数提交表单
<script type="text/javascript" src="https://code.jquery.com/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#submitForm').submit(function(e) { alert($('#sample').attr('value')); return e.preventDefault(); }); }); </script> <form method="post"> <input type="text" value="Enter something" /> <input type="submit" value="Submit" /> </form>
使用 click 处理函数提交表单：
清单 2. 使用 jQuery 的 click 处理函数提交表单
<script type="text/javascript" src="https://code.jquery.com/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#submitBtn').click(function(e) { alert($('#sample').attr('value')); return e.preventDefault(); }); }); </script> <form method="post"> <input type="text" value="Enter something" /> <input type="submit" value="Submit" /> </form>
这两个清单基本上是一样的：它们都是嵌入 jQuery 库的，在访问任何元素之前使用 ready 处理函数确认页面被加载，处理函数包括相同的代码。惟一的不同是处理函数和分配给处理函数的元素。submit 处理函数需要分配一个表单元素，而 click 处理函数，任何可点击的元素即可 — 本例中是 Submit 按钮。为了避免提交表单时刷新页面，您必须使用 preventDefault 函数。要访问 preventDefault 函数，您必须传递处理函数（即使作为一个参数）或者使用它访问该函数。
尽管以上两种选择都是有效的，但 submit 处理函数更为常用些。然而，有些情况下，您可能又不止一个 Submit 按钮，这就需要每个按钮一个 click 处理函数。清单 3 展示了这样一个必须使用 click 处理函数的场景，因为两个 Submit 按钮都能触发表单提交。
清单 3. 使用两个 submit 按钮提交表单
<script type="text/javascript" src="https://code.jquery.com/jquery.js"></script> <script type="text/javascript" src="https://www.jb51.net/register.js"></script> <div> <div></div> <form method="post"> <label for="username">Username</label> <input type="text" value="" /> <label for="password">Password</label> <input type="password" value="" /> <input type="submit" value="Log in" /> <h2>Extra options (registration only)</h2> <label for="firstname">First name</label> <input type="text" value="" /> <label for="lastname">Last name</label> <input type="text" value="" /> <label for="email">Email</label> <input type="text" value="" /> <input type="submit" value="Register" /> </form> </div>
注意，在本例中这个表单可以执行多个活动：现有用户可以登录，新用户可以通过输入附加账户信息进行注册。使用表单上的 submit 处理函数在这种场景中不能运行，因为它不能确定哪个按钮触发表单提交。因此，清单 4 使用 click 处理函数来确定每个按钮采取什么行动，便于您以后依此处理数据。
清单 4. register.js 中提交按钮的 Click 处理函数