为了账号安全,请及时绑定邮箱和手机立即绑定

个人认为是jquery中调用js的function产生的问题,大家有什么建议么?

个人认为是jquery中调用js的function产生的问题,大家有什么建议么?

森林海 2023-04-26 21:17:20
如题。需要根据出生日期输入框的值计算目前年龄(周岁)。已找到可根据出生日期计算周岁的代码(使用原生js编写,既下面代码中的function jsGetAge(strBirthday)),但在采用JQuery编写的主控制js(search.js)中无法调用。代码如下所示:html文件:<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script> <script type="text/javascript" src="js/search.js"></script> ……(无关代码忽略) 出生日期 <input name="info.birthday" type="text" id="birthday" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" class="Wdate" /> 年龄 <input class="shortText" name="info.age" type="text" id="age" /> 岁search.js文件:function jsGetAge(strBirthday) {        var returnAge; var strBirthdayArr=strBirthday.split("-"); var birthYear = strBirthdayArr[0]; var birthMonth = strBirthdayArr[1]; var birthDay = strBirthdayArr[2]; d = new Date(); var nowYear = d.getYear(); var nowMonth = d.getMonth() + 1; var nowDay = d.getDate(); if(nowYear == birthYear) { returnAge = 0;//同年 则为0岁 } else { var ageDiff = nowYear - birthYear ; //年之差 if(ageDiff > 0) { if(nowMonth == birthMonth){ var dayDiff = nowDay - birthDay;//日之差 if(dayDiff < 0) {returnAge = ageDiff - 1;} else {returnAge = ageDiff ;} }else{ var monthDiff = nowMonth - birthMonth;//月之差 if(monthDiff < 0) {returnAge = ageDiff - 1;} else {returnAge = ageDiff ;} } } else {returnAge = -1;//返回-1 表示出生日期输入错误 晚于今天} } return returnAge;//返回周岁年龄} $(document).ready(function() { $("#age").click(function(){ alert(jsGetAge($("#birthday").val())) if($("#birthday").val()!=""){//由于采用日历控件,可保证字符串格式正确 var age = jsGetAge($("birthday").val()) if(age>=0){ $("#age").val()=age $("#age").attr("readonly",true) }else{ $("#birthday").val()="" alert("出生日期不能晚于今天") } } }) })经测试,alert(jsGetAge($("#birthday").val()))无法弹出对应警告框,因此个人认为是jquery中调用js的function产生的问题。大家有什么解决方案吗?谢谢。
查看完整描述

2 回答

?
慕田峪4524236

TA贡献1875条经验 获得超5个赞

不好意思,经过仔细查看和修改,问题已经得到解决。在此总结一下以供其他人借鉴:
1.function jsGetAge(strBirthday)函数的位置没有问题,可写在$(document).ready(function() {}中或外部。
2.问题产生的原因是我的页面同时加载了其他js,加载速度较慢,导致click函数无法快速加载,因此误以为没有效果。实际上是有效果的。
3.大家不要直接使用这个根据生日日期计算周岁的函数,这个函数存在问题,没有对同年进行进一步检验就判定年龄为0周岁。
修改后的计算周岁的函数:

//使用前提:参数strBirthday已经是正确格式的2007-02-09这样的日期字符串(年份必须是完整年份)function jsGetAge(strBirthday)
	{       
		var returnAge;		var strBirthdayArr=strBirthday.split("-");		var birthYear = strBirthdayArr[0];		var birthMonth = strBirthdayArr[1];		var birthDay = strBirthdayArr[2];
		
		d = new Date();		var nowYear = d.getFullYear();		var nowMonth = d.getMonth() + 1;		var nowDay = d.getDate()		
		if(nowYear == birthYear)
		{	
			if(birthMonth<nowMonth)
				returnAge=0;//同年月份为今月前,0岁
			else
				if(birthMonth==nowMonth && birthDay<=nowDay)
					returnAge = 0;//同年同月日期为今天前 0岁
				else 
					returnAge = -1;//同年同月但日为今天后或今月后,日期无效
		}		else
		{			var ageDiff = nowYear - birthYear ; //年之差
			if(ageDiff > 0)
			{				if(nowMonth == birthMonth)
				{					var dayDiff = nowDay - birthDay;//日之差
					if(dayDiff < 0)
					{
						returnAge = ageDiff - 1;
					}					else
					{
						returnAge = ageDiff ;
					}
				}				else
				{					var monthDiff = nowMonth - birthMonth;//月之差
					if(monthDiff < 0)
					{
						returnAge = ageDiff - 1;
					}					else
					{
						returnAge = ageDiff ;
					}
				}
			}			else
			{
				returnAge = -1;//返回-1 表示出生日期输入错误 晚于今天
			}
		}		return returnAge;//返回周岁年龄}


查看完整回答
反对 回复 2023-04-29
?
达令说

TA贡献1821条经验 获得超6个赞

看到你的代码里jsGetAge方法的计算逻辑实在太啰嗦,我就想来简化一下,所以得到第一个方法:

方法1 

function jsGetAge(strBirthday) {
	var yTime = 365*24*60*60*1000,
		bTime = new Date(strBirthday).getTime(),
		nTime = new Date().getTime();

	return Math.floor((nTime-bTime)/yTime);
}

alert(jsGetAge('1984-3-2'))

但这个方法存在一个BUG,因为并不是每年都是365天,所以这里算出来的年龄会有一定的差距;

于是我继续改进有了第二个方法:

方法二 

function jsGetAge(strBirthday) {
	var bDay = new Date(strBirthday),
		nDay = new Date(),
		nbDay = new Date(nDay.getFullYear(),bDay.getMonth(),bDay.getDate()),
		age = nDay.getFullYear() - bDay.getFullYear();	if (bDay.getTime()>nDay.getTime()) {return '日期有错'}
	return nbDay.getTime()<=nDay.getTime()?age:--age;
}

alert(jsGetAge('1984-3-2'))

这里增加了一个生日日期大于今天的错误提示,通过计算今年生日和今天的时间差来判定由年份计算来的时间是否要减1;
经过简单测试感觉逻辑上应该没问题了。


查看完整回答
反对 回复 2023-04-29
  • 2 回答
  • 0 关注
  • 81 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信