jquery事件绑定方式和bug解决

绑定方式

方式一

<p>哈哈</p>
$("p").bind("click",function(){$(this).hide();});
或
$("p").bind("click",event1);
function event1(){
	$(this).hide();
}

方式二

$("#submit").click(function  () {
				
			})

方式三

$("#submit").on("click",function  () {
				
			})

解绑

$("button").unbind("click");//解除button的所有点击事件
$("button").unbind("click",event1);//解除button指定的点击事件

bug跳坑

创建登入对象loginObj,编写提交表单函数_submit(),在初始化函数init()中为按钮添加单击事件监听,但是如果用// $("#submit").bind("click",_that._submit()) // $("#submit").click(_that._submit()) // $("#submit").on("click",_that._submit()的方式添加事件页面一刷新,没有点按钮就会立即执行点击事件,用另外三种种方式则不会

// 登入对象
	var loginObj = {
		
		// 初始化
		init:function  () {
			var _that = this
			
			$("#submit").bind("click",_that._submit())  //可以
			
			$("#submit").click(function  () {
				_that._submit()//不可以
			})
			
			$("#submit").on("click",_that._submit())//可以
			
		},
		
		// 判空
		isNull:function  () {
			
			if ($.trim($("#userName").val()) == "") {
			
				alert("用户名不能为空")
				return false
			} else
			
			if ($("#passWord").val() == "") {
			
				alert("密码不能为空")
				return false
			
			} else
			
			if ($("#act_code").val() == "") {
			
				alert("动态密码不能为空")
				return false
			
			} 
			
			return true
			
		},
		// 判断长度
		isLength:function  () {
			
			// 用户名小于1或者大于20
			if ($.trim($("#userName").val()).length < 1 ||
				$.trim($("#userName").val()).length > 20) {
			
				alert("请输入1-20长度的用户名")
				return false
			} else
			
			if ($.trim($("#passWord").val()).length < 6 ||
				$.trim($("#passWord").val()).length > 16) {
			
				alert("请输入6-216长度的密码")
				return false
			}
			
			return true
			
		},
		
		
		// 判断格式 正则
		
		// 网络请求
		
		// 提交事件
		_submit:function () {
			/**
			 * 判空和长度只要有一方不满足条件retuan  就不执行后面的网络请求
			 * 
			 */
			console.log("56789");
			if (!(this.isNull()&&this.isLength())) {
				return 
			}
			
			// 获取表单数据
			var userName = $.trim($("#userName").val())
			var passWord = $.trim($("#passWord").val())
			var act_code = $.trim($("#act_code").val())
			
			//整合数据
			var registerDto = {
				"userName": userName,
				"passWord": passWord,
				"act_code": act_code,
			}
			console.log(registerDto)
			
			// 发送网络请求
			// var res = req.submit_register(registerDto)//获取整个ajax
			// 	res = res.responseText//拿取responseText
			// 	res = JSON.parse(res)//转js对象
			// 	console.log(res);
				
			//根据返回数据判断是否注册成功并对用户做出对应提示
			
		}
	} 
	
	// 启动函数
	loginObj.init();window.onload = function  () {
	
	
	// 登入对象
	var loginObj = {
		
		// 初始化
		init:function  () {
			var _that = this
			
			
			// 可以
			$("#submit").bind("click",function  () {
				_that._submit()
			})  //可以
			
			$("#submit").click(function  () {
				_that._submit()//不可以
			})
			
			$("#submit").on("click",function  () {
				_that._submit()
			})
			
			//不可以
			
			// $("#submit").bind("click",_that._submit())  
			// $("#submit").click(_that._submit())
			// $("#submit").on("click",_that._submit())
		},
		
		// 判空
		isNull:function  () {
			
			if ($.trim($("#userName").val()) == "") {
			
				alert("用户名不能为空")
				return false
			} else
			
			if ($("#passWord").val() == "") {
			
				alert("密码不能为空")
				return false
			
			} else
			
			if ($("#act_code").val() == "") {
			
				alert("动态密码不能为空")
				return false
			
			} 
			
			return true
			
		},
		// 判断长度
		isLength:function  () {
			
			// 用户名小于1或者大于20
			if ($.trim($("#userName").val()).length < 1 ||
				$.trim($("#userName").val()).length > 20) {
			
				alert("请输入1-20长度的用户名")
				return false
			} else
			
			if ($.trim($("#passWord").val()).length < 6 ||
				$.trim($("#passWord").val()).length > 16) {
			
				alert("请输入6-216长度的密码")
				return false
			}
			
			return true
			
		},
		
		
		// 判断格式 正则
		
		// 网络请求
		
		// 提交事件
		_submit:function () {
			/**
			 * 判空和长度只要有一方不满足条件retuan  就不执行后面的网络请求
			 * 
			 */
			console.log("56789");
			if (!(this.isNull()&&this.isLength())) {
				return 
			}
			
			// 获取表单数据
			var userName = $.trim($("#userName").val())
			var passWord = $.trim($("#passWord").val())
			var act_code = $.trim($("#act_code").val())
			
			//整合数据
			var registerDto = {
				"userName": userName,
				"passWord": passWord,
				"act_code": act_code,
			}
			console.log(registerDto)
			
			// 发送网络请求
			// var res = req.submit_register(registerDto)//获取整个ajax
			// 	res = res.responseText//拿取responseText
			// 	res = JSON.parse(res)//转js对象
			// 	console.log(res);
				
			//根据返回数据判断是否注册成功并对用户做出对应提示
			
		}
	} 
	
	// 启动函数
	loginObj.init();
	
}



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值