在JQuery日期选择器中再添加一个事件当前添加功能不起作用
Adding one more event in JQuery date picker the current adding functionalities not working
目前正在使用jquery计算年份。这和预期的一样完美，但我想再添加一个函数。如果用户输入了错误的值，例如121212，它应该说"您输入了错误格式。请输入正确的格式"。
$('.startDate').change(function(event) {
var txtVal6 = $(this).val();
//alert("check what" + txtVal);
if (isDate5(txtVal6)) {
$(this).removeClass("errRed");
event.stopImmediatePropagation();
} else {
alert('Kindly enter date in valid format');
$(this).addClass("errRed").val("");
event.stopImmediatePropagation();
}
});
function isDate5(startDate) {
var currVal6 = startDate;
if (currVal6 == '') return false;
var rxDatePattern6 = /^'d{2}[./-]'d{2}[./-]'d{4}$/; //Declare Regex
var dtArray6 = currVal6.match(rxDatePattern6); // is format OK?
if (dtArray6 == null) return false;
//Checks for mm/dd/yyyy format.
dtMonth6 = dtArray6[3];
dtDay6 = dtArray6[5];
dtYear6 = dtArray6[1];
if (dtMonth6 < 1 || dtMonth6 > 12) return false;
else if (dtDay6 < 1 || dtDay6 > 31) return false;
else if ((dtMonth6 == 4 || dtMonth6 == 6 || dtMonth6 == 9 || dtMonth6 == 11) && dtDay6 == 31) return false;
else if (dtMonth6 == 2) {
var isleap = (dtArray6 % 4 == 0 && (dtArray6 % 100 != 0 || dtArray6 % 400 == 0));
if (dtDay6 > 29 || (dtDay6 == 29 && !isleap)) return false;
}
return true;
}
$('.endDate').change(function(event) {
var txtVal7 = $(this).val();
//alert("check what" + txtVal);
if (isDate6(txtVal7)) {
$(this).removeClass("errRed");
event.stopImmediatePropagation();
} else {
alert('Kindly enter date in valid format');
$(this).addClass("errRed").val("");
event.stopImmediatePropagation();
}
});
function isDate6(endDate) {
var currVal7 = endDate;
if (currVal7 == '') return false;
var rxDatePattern7 = /^'d{2}[./-]'d{2}[./-]'d{4}$/; //Declare Regex
var dtArray7 = currVal7.match(rxDatePattern7); // is format OK?
if (dtArray7 == null) return false;
//Checks for mm/dd/yyyy format.
dtMonth7 = dtArray7[3];
dtDay7 = dtArray7[5];
dtYear7 = dtArray7[1];
if (dtMonth7 < 1 || dtMonth7 > 12) return false;
else if (dtDay7 < 1 || dtDay7 > 31) return false;
else if ((dtMonth7 == 4 || dtMonth7 == 6 || dtMonth7 == 9 || dtMonth7 == 11) && dtDay7 == 31) return false;
else if (dtMonth7 == 2) {
var isleap = (dtArray7 % 4 == 0 && (dtArray7 % 100 != 0 || dtArray7 % 400 == 0));
if (dtDay7 > 29 || (dtDay7 == 29 && !isleap)) return false;
}
return true;
}
使用此代码，如果我在文本字段到日期字段中输入值12112，它会说请输入正确的值，但如果我在从和到字段中输入正确的日期值，则年份的计算不起作用。
提前感谢
这是小提琴链接
不知道为什么你不使用Date对象中内置的Javascript，无论如何，我在你的脚本中做了一些更改，从RegExp开始，删除了一些没有用的函数
这就是我所做的：
var dateRegex=new RegExp("^[0-9]{2}-[0-9]{2}-[0-9]{4}$");
$(document).on('change', ".datepicker", function() {
// No need for each() part, you already know which one is the start and which one is the end
if($(this).val()){
if(!dateRegex.test($(this).val())){
alert('Kindly enter date in valid format');
$(this).val('');
return false;
}
}
if($(".startDate").val() && $(".endDate").val()){
var dateStart = $(".datepicker.startDate").val(),
dateEnd = $(".datepicker.endDate").val();
// No need even for array, you just get datepicker value like this and test it
var dateStartArray=dateStart.split('-'),dateEndArray=dateEnd.split('-');
var fromdate=new Date(dateStartArray[2],dateStartArray[0]-1,dateStartArray[0]),
todate=new Date(dateEndArray[2],dateEndArray[0]-1,dateEndArray[0]);
// Creating date object with format YYYY-MM-GG ( taken from datepicker's split array )
console.log(fromdate);
console.log(todate);
if(fromdate>todate){
alert("To date should be greater than from date");
return false;
} else {
var yearsDifference=todate.getFullYear()-fromdate.getFullYear();
var monthsDifference=(todate.getMonth()+12*todate.getFullYear())-(fromdate.getMonth()+12*fromdate.getFullYear());
$("#txt_expy").html(Math.floor(monthsDifference/12)+' Years');
$("#txt_expm").html((monthsDifference%12)+' Months');
}
} else {
return false;
}
});
你可以查看这个fiddle来查看我所做的所有修改，看看这是否有帮助：）
更新代码
var diffDays = 0;
$(".cloned-row3").find(".datepicker").removeClass('hasDatepicker').datepicker({
dateFormat: "mm-dd-yy",
changeMonth: true,
yearRange: "-100:+0",
changeYear: true,
maxDate: new Date(),
showButtonPanel: false,
beforeShow: function() {
setTimeout(function() {
$('.ui-datepicker').css('z-index', 99999999999999);
}, 0);
}
});
var count = 0;
$(document).on("click", ".exp_add_button", function() {
var $clone = $('.cloned-row3:eq(0)').clone(true, true);
$clone.find('[id]').each(function() {
this.id += 'someotherpart'+count;
});
$clone.find('.btn_more').after("<input type='button' class='btn_less1 selbtnless' id='buttonless' value='remove'/>")
$clone.attr('id', "added" + (++count));
$clone.find(".startDate").val('');
$clone.find(".endDate").val('');
/*$clone.find(".degree_Description").attr('disabled', true).val('');*/
$clone.find("input.startDate").removeClass('hasDatepicker').removeData('datepicker')
.unbind()
.datepicker({
dateFormat: "mm-dd-yy",
changeMonth: true,
yearRange: "-100:+0",
changeYear: true,
maxDate: new Date(),
showButtonPanel: false,
beforeShow: function() {
setTimeout(function() {
$('.ui-datepicker').css('z-index', 99999999999999);
}, 0);
}
});
$clone.find("input.endDate")
.removeClass('hasDatepicker')
.removeData('datepicker')
.unbind()
.datepicker({
dateFormat: "mm-dd-yy",
changeMonth: true,
yearRange: "-100:+0",
changeYear: true,
maxDate: new Date(),
showButtonPanel: false,
beforeShow: function() {
setTimeout(function() {
$('.ui-datepicker').css('z-index', 99999999999999);
}, 0);
}
});
$(this).parents('.wrk_exp').after($clone);
});
$(document).on('click', ".btn_less1", function() {
var len = $('.cloned-row3').length;
if(len > 1) {
var RemoveStartDate = $(this).closest(".btn_less1").parent().parent().parent().find('.startDate ').val();
var RemoveEndDate = $(this).closest(".btn_less1").parent().parent().parent().find('.endDate ').val();
if((RemoveStartDate!='')||(RemoveEndDate!='')){
var dateStartArray=RemoveStartDate.split('-'),dateEndArray=RemoveEndDate.split('-');
var fromdate=new Date(dateStartArray[2],dateStartArray[0]-1,dateStartArray[0]),
todate=new Date(dateEndArray[2],dateEndArray[0]-1,dateEndArray[0]);
var yearsDifference=todate.getFullYear()-fromdate.getFullYear();
var monthsDifference=(todate.getMonth()+12*todate.getFullYear())-(fromdate.getMonth()+12*fromdate.getFullYear());
var PrevTotalYear = parseInt($("#txt_expy>span").text());
var PrevTotalMonth = parseInt($("#txt_expm>span").text());
$("#txt_expy>span").text('');
$("#txt_expm>span").text('');
PrevTotalYear = PrevTotalYear*12;
var CurTotalYear = Math.floor(((PrevTotalYear+PrevTotalMonth)-monthsDifference)/12);
var CurTotalMonth = (monthsDifference-PrevTotalMonth)%12;
$("#txt_expy>span").text(CurTotalYear);
$("#txt_expm>span").text(CurTotalMonth);
$(this).closest(".btn_less1").parent().parent().parent().remove();
}else{
$(this).closest(".btn_less1").parent().parent().parent().remove();
}
}
});
$(document).on('change', ".datepicker", function() {
// No need for each() part, you already know which one is the start and which one is the end
dateRegex=new RegExp("^[0-9]{2}-[0-9]{2}-[0-9]{4}$");
if($(this).hasClass('startDate')) {
var dateStart = $(this).val();
if(!dateRegex.test(dateStart)){
alert('Kindly enter date in valid format');
return false;
}
return false;
}
else if($(this).hasClass('endDate') && isNaN($(this).val())|| $(this).val()!='') {
var dateEnd = $(this).val();
if(!dateRegex.test(dateEnd)){
alert('Kindly enter date in valid format');
return false;
}else{
dateStart = $(this).closest('.row').find('.startDate').val();
}
}else{
return false;
}
if((dateStart!='')||(dateEnd!='')){
// No need even for array, you just get datepicker value like this and test it
var dateStartArray=dateStart.split('-'),dateEndArray=dateEnd.split('-');
var fromdate=new Date(dateStartArray[2],dateStartArray[0]-1,dateStartArray[0]),
todate=new Date(dateEndArray[2],dateEndArray[0]-1,dateEndArray[0]);
// Creating date object with format YYYY-MM-GG ( taken from datepicker's split array )
if(fromdate>todate){
alert("To date should be greater than from date");
return false;
} else {
var yearsDifference=todate.getFullYear()-fromdate.getFullYear();
var monthsDifference=(todate.getMonth()+12*todate.getFullYear())-(fromdate.getMonth()+12*fromdate.getFullYear());
var PrevTotalYear = parseInt($("#txt_expy>span").text());
var PrevTotalMonth = parseInt($("#txt_expm>span").text());
$("#txt_expy>span").text('');
$("#txt_expm>span").text('');
PrevTotalYear = PrevTotalYear*12;
var CurTotalYear = Math.floor((monthsDifference+PrevTotalYear+PrevTotalMonth)/12);
var CurTotalMonth = (monthsDifference+PrevTotalMonth)%12;
$("#txt_expy>span").text(CurTotalYear);
$("#txt_expm>span").text(CurTotalMonth);
}
}
else {
return false;
}
});
小提琴链接
相关文章：
- 我可以在json对象中添加一个函数吗
- 单击更改图标并通过javascript添加一个css类
- 将添加一个相同类型的事件附加或覆盖以前添加的具有相同名称的事件
- 有没有添加一个ng点击到md背景
- 如何为下拉列表的每个选项添加一个属性
- 如何使用Javascript在给定的句子中找到大写单词并在其前面添加一个字符
- 在iframe中加载url并添加一个类
- 添加一个setTimeout方法会使jQuery悬停方法忽略setTimeout方法中的函数
- Jquery添加一个类之后，如何应用css
- jQuery在悬停时只添加一个类
- 添加一个javascript函数来下载elfinder上的事件
- 仅首先需要使用jasmine从节点添加一个文件
- 尝试添加一个选项以使用append进行选择，但没有任何结果
- 简单的Javascript方式，在输入字段的每5位数字后添加一个空格
- 如何使用JavaScript's”;应用“;方法，在数组之前添加一个额外的参数
- 在xsl中为body onload添加一个值
- 当用户单击按钮(在光标位置）时，在输入字段中添加一个文本字符串
- 添加一个元素，它's通过JS的类名
- 当我添加一个新数字时，如何获得一些数字的即时平均值
- 在跨度中每3个字符添加一个空格
