用js动态添加登录表单并完成提交实现在html注册后自动登录

2016.12.14原文：

注册的表单提交和数据同样是在html间完成的，为此单独写了register.html来处理index页面提交过来的注册表单数据。

			var url = location.search;
			var Request = new Object();
			var NEWSTAG = 0;
			if(url.indexOf('?') != -1) {
				var str = url.substr(1)　 //去掉?号
				strs = str.split('&');
				for(var i = 0; i < strs.length; i++) {
					Request[strs[i].split('=')[0]] = unescape(strs[i].split('=')[1]);
				}
			}

这一部分是拿到url后缀的注册表单数据（可详见http://blog.csdn.net/rhythm923/article/details/53615009）
之后便是利用存在Request中的数据来进行ajax异步传输处理：

                     $.ajax({
				type: "post","
				url: 后台接口,
				data: {
					'userEmail': Request['runame'],
					'passwd': Request['rupwd'],
					'uName': Request['uName']
				},
				dataType: "json",
				success: function(data) {
					if(data["msg"] == "true") {
                                        var html= '';
                                        html = '
'+
					            ''+
	                                            ''+
	                                            '
';
					           document.getElementById('box').innerHTML = html;
					           $('.login').bind("onload",putmsg());
					}
                                 }
                      });
                      function putmsg(){
				$('.login').click();
                      }

标红的bind()函数是关键，js动态生成的html内容在html onload 和js读取dom之后，所以直接在动态生成的提交按钮中写"οnlοad='putmsg()'"是不起作用的，使用jquery(document).ready(function(){})的加载方法也是不行的。

使用bind()为提交按钮绑定onload事件，则可以在按钮生成时调用绑定function()。

之后就是在main.html处理登录表单以完成自动登录了，详见http://blog.csdn.net/rhythm923/article/details/53615009。

2017.3.26修改：

之前的注册是利用了另一个html页面单独来验证的，这涉及到页面跳转多次的问题，无疑会降低速度，也使得项目文件变得臃肿，于是把注册成功之后自动登陆的功能整合到一一起。

			//注册
			function register() {
				var uname = $("input[name='runame']").val();
				var uName = $("input[name='uName']").val();
				var upwd = $("input[name='rupwd']").val();
				$.ajax({
					type: "post",
					url: "*",
					data: {
						'userEmail': uname,
						'passwd': upwd,
						'uName': uName,
						'icon': "http://ip/img/guest.png"
					},
					dataType: "json",
					success: function(data) {
						if(data["msg"] == "true") {
							$('.register-close').click();
							$.ajax({
								type: "post",
								url: "*",
								data: {
									'email': uname,
									'password': upwd
								},
								dataType: "json",
								success: function(data) {
									if(data['uName'] != undefined) {
										$('.login-close').click();
										swal("注册成功", "已自动登录", "success");
										var html = '';
										html = '' + data['uName'] + '欢迎您！
NO
';
										document.getElementById('usershow').innerHTML = html;
										$('.checklogin').text(data['userId']);
										$('.useremail').text(data['userEmail']);
										$('.userimg').text(data['icon']);
										document.cookie = "uid=" + data['userId'] + " uname=" + escape(data['uName']) + " email=" + escape(data['userEmail']) + " icon=" + escape(data['icon']);
									}
								}
							});
						} else if(data["msg"] == "该账号已被注册！") {
							swal({
								title: "对不起",
								text: "该账号已被注册",
								type: "warning"
							});
						} else if(data["msg"] == "false") {
							swal({
								title: "对不起",
								text: "出现未知错误，请重新注册",
								type: "warning"
							});
						} else {

						}
					}
				});
			}

运用了大量的动态修改dom，完成了在单一页面完成注册之后自动登陆。

注：swal（）函数是使用了sweetAlert插件。