layui中日期控件的添加小图标控制日期选择器

layui中官网上大部分都是input框的click或者focus事件就创建弹出了日期选择器，如果是弹出界面小的情况下，默认的选择器大小就遮挡其他的控件。手输入日期就变得无法操作。

实现思路：

在监听事件中创建图片点击事件，点击事件的才创建。这个时候html中的对应的input需要一个标识。这个随便起名字。如date-type。

如果创建日期选择器时date-type是date,其他是text。

图片点击有两个事件，一个是创建日期选择器，一个是将日期选择器去掉。

这时图片click事件的时候，需要先判断日期选择器在不在界面上，在，则date-type=date,不在是text。

根据date-type判断此次点击是创建还是去掉日期选择器。

遇到的问题

写这个文章的原因是只要创建日期控件一次之后，即使remove日期选择器，input的聚焦（focus）事件会重新将其创建出来。百度了许久，又不会改底层laydate。困扰了许久，各种去掉focus事件不起作用。

解决方案

//监听日期input
 $(document).on('focus', '#input的id', function () {
            window.event.preventDefault();
            window.event.stopPropagation();
            return false;
   });

起到作用的是 window.event.stopPropagation();不需要监听document这么大的focus,只要监听input框的父元素应该就可以了（我没有实验）。