使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效
最近写页面时需要用到,日期选择器,网上搜索了一些插件,最后使用了flatpickr.js。我是从npm 上拉下的依赖 npm install flatpickr --save
随后在页面中引入css,js文件,引入css文件时,可以大致留意一下,选择自己喜欢的色调,
引入js文件:
html代码:
界面效果:
在使用的过程中我遇到了一些问题,当我动态创建一个input标签时,选择器没效果了,
原因是,当把新创建的元素添加到页面时,插件还未加载完毕,所以就不起作用
解决的办法是,自己手动初始化插件,具体代码如下:
当然了写完这句代码还是不起作用,你还需要加一句代码,新创建的元素也需要初始化啊:
这样,bug就完美解决了,希望能帮到遇到同样问题的你!
使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效的更多相关文章
- JQuery日期选择器插件date-input
JQuery日期选择器插件之date-input 官方网站:http://jonathanleighton.com/projects/date-input/ 下载地址: http://github.c ...
- JS动态引入js、CSS动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. function addCssByLink(url){ var doc=document; var link=doc.create ...
- jquery 动态创建的元素,绑定事件无效之解决方法
今天遇到一个问题,动态创建的元素,绑定事件无效,如下: js 代码如下: var OaddX = $('.detright div.duibi div.duibox ul li span'); // ...
- jQuery动态创建html元素的常用方法汇总
在使用jQuery进行WEB程序设计的时候非常有用.分享给大家供大家参考.具体方法如下: 一般来说,可以通过以下几种方式动态创建html元素: 1.使用jQuery创建元素的语法 2.把动态内容存放到 ...
- 用jQuery绑定事件到动态创建的元素上
jQuery最常用的一个功能就是对DOM的操作,与之相关的比如对事件的绑定和Ajax动态内容加载.当我们绑定事件到Ajax load回来的内容上或其他动态创建的元素上时会发现事件没响应,和你预想的结果 ...
- jQuery 绑定事件到动态创建的元素上
在进入主题之前,我们先来看一个前台页面经常用到的功能:点击页面输入框时自动选择其中文本. 很容易想到利用输入框的focus事件,当输入框获得焦点时,再调用jQuery的select()方法. Okay ...
- jquery动态创建页面元素
jquery用$()方法动态创建一个页面元素,例如: var $div=$("<div title='动态创建页面元素'>欢迎创建一个新的div</div>" ...
- 基于jQuery动态创建html元素
在做web前端开发的时候,经常遇到一些数据多少或则类型不能在运行之前就确定下来的情况,此时,数据的展示,就要借助于动态创建html元素来展示了. 常见的动态创建HTML元素的方式,有如下几种,大体都差 ...
- JS提交表单页面不跳转、JS下载、动态创建from
JS下载 function downloadFile(id) { var url = "<%=request.getContextPath()%>/cer/downlo ...
随机推荐
- mysql记录执行的SQL语句
show variables like "general_log%"; SET GLOBAL general_log = 'ON';SET GLOBAL general_log = ...
- 深入理解css优先级
为什么要写这篇文章是因为 <style type="text/css"> body h1 { color: green; } html h1 { color: purp ...
- 【Linux】在Win10上搭建WSL(适用于Linux的Windows子系统)
1.打开WSL ,控制面板 -- 程序 -- 程序和功能 -- 打开或关闭Windows功能 - 选中[适用于Linux的Windows子系统] 2.开启后重启电脑 3.在Win10自带的Micro ...
- iOS webview 获取html中的图片地址
//js代码,声明1个数组,对img 进行遍历,采用,分割多个url NSString * getAllImages = @"var str = new Array();" &qu ...
- C++构造函数和析构函数的调用顺序
1.构造函数的调用顺序 基类构造函数.对象成员构造函数.派生类本身的构造函数 2.析构函数的调用顺序 派生类本身的析构函数.对象成员析构函数.基类析构函数(与构造顺序正好相反) 3.特例 局部对象,在 ...
- sqlserver 删除表 视图 函数 存储过程
use tax_ceshiselect 'DROP TABLE '+name from sysobjects where type = 'U'union select 'DROP VIEW '+nam ...
- 在同一个Apache服务器软件上部署多个站点的基础方法
这篇文章主要介绍了Apache中Virtual Host虚拟主机配置及rewrite模块中的重要参数说明,是在同一个Apache服务器软件上部署多个站点的基础方法,需要的朋友可以参考下(http:// ...
- Macbook pro从购买服务器到搭建服务器环境(2)
这里是在Mac本地上安装软件遇到的坑,先总结一下 在装完mysql的时候,安装wget,这个时候遇到的问题是openssl软件包找不到,我已经不记得是什么时候安装的openssl了,所以用命令查一下 ...
- phpstudy配置本地https
百度经验(me'i经过测试) 首先申请免费的ssl证书,很多地方都可以申请.我是在腾讯云!如图 下载证书备份好.以免丢失.解压下载的证书,里面有4个文件夹相对应不同的安装环境,我们用的是Apache, ...
- Emgucv使用中常用函数总结
Emgucv常用函数总结: 读取图片 Mat SCr = new Mat(Form1.Path, Emgu.CV.CvEnum.LoadImageType.AnyColor); //根据路径创建指定的 ...