E8-怎么监听表单里的日期控件被修改过

news2024/11/29 14:52:38

起因

业务部门每周六例会,业务部门请假的,如果包含星期六,需要老板审批。

我思路是当开始日期或结束日期被修改时,判断请假日期中是否包括周六,根据是束包含周六,去设置某个控件的值,后续步骤根据这个控件的值去确定流程的走向。

这篇文章记录这个需求中,我解决的第一个问题的过程,怎么知道表单里的时间控件被修改过。

经过

起初,认为这个问题很简单。写个JQUERY不就好了嘛,就像下面这么写。

// 日期控件的修改事件
    $("#field9442").change(function(){
        alert("开始日期修改事件");
    });

 发起流程,填写表单,修改日期时并不弹这个提示框,说明change事件并没有触发。在网上逛了一圈,按网上的说法,又做了一下测试,接下来按我的理解来说一下为什么change事件没有被触发。

change事件会在<input type="text">的控件失去焦点时value的值和获得焦点时value的值相比,如果发生变化了,会触发change事件。

说白了,触发change方法是在失去焦点时触发,并且要满足两个先决条件,一个获得焦点,一个是值发生改变。这就不难理解了,由于E8中用到的日期控件,展示给用户看的是个<span>标签,实际存值的<input>标签是隐藏的,虽然其值发生了变化,但并没有获得焦点和失去焦点的过程,所以并不会触发change事件。

还有小伙伴说,泛微有自己的API,可以按以下的方法写。

WfForm.bindFieldChangeEvent("#field9442", function () {
alert("开始日期修改事件2");
})

 有同样想法的小伙伴们请注意,这个方法只适用于E9,至于适不适用E9以上的版本,不确定。但它真的不适用E8,提示"WfForm is not defined"。

最后,我的解决方法是从对应的<span>上想办法。日期控件的DOM结构是这样式儿的。每个控件的组成,有一个<button>按钮,点击之后弹出日期选择框;有一个<span>标签,负责展示信息给用户看;有一个<input>标签,不可见,负责储存、提交数据用。

可以看出来,与控件对应的<span>标签的ID的命名规则是控件名加“span”。

网上找到了这么段代码,给<span>标签的DOMNodeInserted事件绑定方法。

    $("#field9442span").bind('DOMNodeInserted',function(e){
        alert("444");
    });

结果

以上方法能够实现了临听E8工作流的日期控件的方法了,继续去实现后续的功能了。

儿童快乐!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/597374.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Zero to One系列】springcloud微服务集成nacos,形成分布式系统

前期回顾&#xff1a; 【Zero to One系列】在WSL linux系统上&#xff0c;使用docker运行Mysql与Nacos 1、Nacos配置设置 先在nacos创建命名空间&#xff0c;如下图操作&#xff1a; 创建完成后&#xff0c;服务列表和配置列表&#xff0c;就都会出现如图的tab&#xff1a; 然…

南京邮电大学电工电子基础B实验八(译码与动态显示电路)

文章目录 一、 实验目的二、 主要仪器设备及软件三、 实验原理四、 实验任务与设计过程实验任务&#xff1a;设计过程&#xff1a; 五、 实验步骤与仿真结果1&#xff0e;用BCD七段显示译码器显示本人学号的后四位&#xff08;0709&#xff09;2&#xff0e;用BCD七段显示译码器…

API电商 ERP 数据管理

没有 API&#xff0c;应用之间的通信将会被扼杀&#xff1b;软件开发者将不断重写并执行相同功能的软件&#xff1b;创新的脚步将会放缓。 API 随处可见。大到一个软件系统&#xff0c;小到几行程序&#xff0c;只要具备了一定的特征&#xff0c;都可以被称作 API。那么&#…

产品手册是团队营销的心脏,让企业宣传更上一层楼

产品手册是企业团队营销的重要工具之一&#xff0c;能够帮助企业更好地宣传产品并提高销售业绩。在现代企业市场竞争日益激烈的情况下&#xff0c;如何制作一份优秀的产品手册成为了企业团队营销的重要课题。本文将从以下几个方面探讨产品手册对团队营销的意义以及如何制作一份…

RocksDB笔记 -- 整体架构

RocksDB是由Facebook开发的存储引擎, 它最初的目标是用于快速存储, 特别是Flash存储. 一个基于C开发keys-values存储引擎库. 整体架构 RocksDB由这三个基本结构组成: memtable, sstfile 和 logfile. 其中: memtable是一个内存数据结构, 新的写入会插入到memtable中, 同时可选…

前端加密对抗——CDP远程调用Debug断点函数python代码实现

文章目录 前端加密对抗——CDP远程调用Debug断点函数python代码实现实现请求断点处函数mitmproxy实现加解密 前端加密对抗——CDP远程调用Debug断点函数python代码实现 前几天看了看tools推送的前端加密的文章&#xff1a;前端加密对抗Part2-通过CDP远程调用Debug断点函数觉得…

NR 5G 系统消息MIB和SIB详解

系统信息分类 系统信息与各个信道的映射图示&#xff1a; 在5G高层中&#xff0c;系统信息可以分为三类&#xff1a; 最少系统信息&#xff08;Minimum System Information&#xff0c;MSI&#xff09;&#xff1a; MSI包括MIB和RMSIMIB的RRC消息 MasterInformationBlockMI…

DTU902 工控机 边缘计算网关

边缘计算网关&#xff08;Edge Computing Gateway&#xff09;是一种连接边缘设备和云端服务器的中间件设备&#xff0c;它可以处理和存储大量的数据&#xff0c;提高数据处理和传输的效率。边缘计算网关可以将数据预处理和过滤&#xff0c;减少数据传输到云端的负荷&#xff0…

2023 最新版IntelliJ IDEA 2023.1创建Java Web前(vue3)后端(spring-boot3)分离 项目详细步骤(图文详解)

文章目录 &#x1f6a9; 接上篇&#x1f3f3;‍&#x1f308; 项目构建所需的相关工具JavaIDEAmavenNodeJSVueVisual Studio Code &#x1f30c; 后端项目创建详细步骤&#x1f6eb; 1、开始创建新项目&#x1f6eb; 2、输入项目名称、选择项目存储位置、项目管理工具&#xff…

HTTP 教程1

HTTP 协议一般指 HTTP&#xff08;超文本传输协议&#xff09;。 超文本传输协议&#xff08;英语&#xff1a;HyperText Transfer Protocol&#xff0c;缩写&#xff1a;HTTP&#xff09;是一种用于分布式、协作式和超媒体信息系统的应用层协议&#xff0c;是因特网上应用最为…

CPO技术重塑光模块:行业变革与突破

随着OpenAI的ChatGPT重磅面世&#xff0c;在短短时间内&#xff0c;内容生成式人工智能消费级应用掀起一波新的科技浪潮。ChatGPT用户数也在短短两个月内破亿,成为史上活跃用户破亿速度最快的软件。 可以预料的是,未来算力和数据需求将迎来爆发式的增长,且传统可插拔光模块技术…

3.2 动态规划算法的基本要素

博主简介&#xff1a;一个爱打游戏的计算机专业学生博主主页&#xff1a; 夏驰和徐策所属专栏&#xff1a;算法设计与分析 学习目标&#xff1a; 如果我要学习动态规划算法的基本要素&#xff0c;我会采取以下步骤&#xff1a; 1. 理解概念&#xff1a;首先&#xff0c;我会研…

【程序】基于matlab使用脉冲压缩估计范围和多普勒

一、前言 本例显示了脉冲压缩的效果&#xff0c;其中发射的脉冲被调制并与接收的信号相关联。雷达和声纳系统使用脉冲压缩&#xff0c;通过缩短回波持续时间来提高信噪比&#xff08;SNR&#xff09;和距离分辨率。此示例还演示了多普勒处理&#xff0c;其中目标的径向速度由目…

Windows10系统下YOLOv5配置(Tesla P40 24GB、CUDA10.2)

操作系统&#xff1a;Windows10 显卡&#xff1a;Tesla P40 24GB CUDA版本&#xff1a;10.2 YOLOv5版本&#xff1a;4.0 一、下载 CUDA&cuDNN 下载相应版本的CUDA按默认一路安装到底 下载相应版本的cuDNN&#xff0c;解压&#xff0c;将bin中、include中、lib中文件…

CV | ⑩分钟实现视频人脸情绪生成(论文+代码)

本博客主要讲解了Emotionally Enhanced Talking Face Generation&#xff08;情感增强的谈话人脸生成&#xff09;论文概括与项目实现&#xff0c;以及代码理解。 Emotionally Enhanced Talking Face Generation Paper :https://arxiv.org/pdf/2303.11548.pdf Code: GitHub - s…

java民俗传统文化宣传分享网站springboot+vue

本传统文化网站有管理员和用户两个角色&#xff0c;管理员有&#xff0c;个人中心&#xff0c;用户管理&#xff0c;文章类型管理&#xff0c;文章信息管理&#xff0c;投票信息管理&#xff0c;留言板管理&#xff0c;系统管理。用户有个人中心&#xff0c;我的收藏&#xff0…

C++数据结构:二叉树之三(二叉搜索树扩展)

文章目录 前言一、搜索父节点二、搜索子节点三、搜索前驱后继节点四、计算二叉树的高度五、测试总结 前言 我们接着写二叉树&#xff0c;在前文链接&#xff1a;《二叉树之二》中&#xff0c;我们生成了如下的有序二叉树&#xff0c;并且实现了插入、删除和四种遍历方法。今天…

搭建 LNMP平台

搭建LNMP平台 一. 安装Nginx服务1.1 安装依赖包1.2 创建运行用户1.3 编译安装1.4 优化路径1.5 添加 Nginx 系统服务 二. 安装mysql服务2.1 安装Mysql环境依赖包2.2 创建运行用户2.3 编译安装2.4 修改mysql 配置文件2.5 更改mysql安装目录和配置文件的属主属组2.6 设置路径环境变…

C进阶:数据在内存中的存储(2)

六一儿童节快乐哇各位过期的小朋友们 引入&#xff1a; 在上一篇博文中&#xff0c;相信大家对于数据类型以及整数在内存中的存储有了一定了解&#xff0c;那么&#xff0c;浮点数是怎么在内存中存储的呢&#xff1f;下面来看一下我的讲解。 浮点数家族&#xff1a; 包括&#…

Python四则运算“计算器”——整数口算练习“小程序”

设定练习题目数量、最大取值整数数&#xff0c;即时判定&#xff0c;答对鼓励答错打印正确结果。 【学习的细节是欢悦的历程】 Python 官网&#xff1a;https://www.python.org/ Free&#xff1a;大咖免费“圣经”教程《 python 完全自学教程》&#xff0c;不仅仅是基础那么简…