关于日期控件中使用change事件无效的解决方法

向右看齐 2022-10-26 12:50 486阅读 0赞

前端页面突然需要在选择时间后自动获取所选时间内的设备信息，我立刻写了一个change（）方法，测试时发现没有触发

原因是：**change事件其实就是在元素获得焦点的时候，保存当前值，失去焦点的时候，会将当前值和原来保存起来的值进行比较，如果不同，则触发change事件。**  
而 在绑定了日期控件之后绑定change事件，其实文本框的值是一直没有改变的，所以不会触发。

查询资料时有些网友说改日期控件，在日期控件触发确定按钮时调用自己写的自定义函数即可

我这就不修改日期控件，使用以下方法即可：

HTML：

onfocus事件不会触发自定义的change事件，如果我们想要触发change事件实现自己想要预定的功能，可以在原来定义日期控件的html的代码后面直接再次的调用手动触发change事件

JS：

$("#startTime").bind("change",function(){
    			
    			var flag = false;
    			var startTime = Page.$("#startTime").val();
    			if(startTimes!=startTime){
    				startTimes=startTime;
    				flag=true;
    			}
    			var endTime = Page.$("#endTime").val();
    			if(flag){
    				Page.loadSelect({
    					target : Page.$("#deviceName"),
    					textField : "text",
    					data : {"xxxx":xxxx,"startTime":startTime,"endTime":endTime},
    					url : "xxx/xxx"
    				});
    			}
    
    		});

这里的flag是因为我发现如果不设置时间值比较的话，点击日期时间就会发请求，点确认日期按钮也会发请求，我只需要发一次请求即可，startTimes是一个全局变量。