bootstrap3添加日期控件中碰到的问题

更多2019年的技术文章,欢迎关注我的微信公众号:码不停蹄的小鼠松(微信号:busy_squirrel),也可扫下方二维码关注获取最新文章哦~

和bootstrap2相比,bootsrap3的改动还是很大的,很多原有的在bootstrap2上开发的js插件,移植到bootsrap3上以后,出现了各种问题,而这些问题,在刚开始的时候很难找出错误出在哪儿。

最近在做国电南自的一个项目,需要用到日期控件,前台界面用bootstrap3 + js,网上大多数给出的都是基于bootstrap2.2开发的js插件,这里先给出一个链接,不妨先看一下:http://www.open-open.com/lib/view/open1356568521682.html。

但用了之后,点击文本框后面的日期按钮,总是出不来,折腾了好久,最终还是放弃,若有哪位大虾弄明白个中缘由,望告知一下。抛弃了这种方法,又在网上找到了另外一种基于js的日期控件,http://jqueryui.com/datepicker,用这个控件以后本以为会躲过bootstrap3版本兼容的问题,但是又是折腾了好久,仍然出现了相同的问题,在chrome的“审查元素”中调试,出现的错误如下:

 

这里总是报错: Uncaught TypeError: undefined is not a function
1、变量名和函数名相同;
2、js找不到当前调用的函数;
在否定了第一个原因后,查找第二个原因可能出现的地方。经过多次对比,发现了问题所在,在bootstrap3写的前台页面中,一般会有如下代码片段,对函数库的引用:

bootstrap3添加日期控件中碰到的问题_第1张图片

 

 

 

这几个库函数的引用导致了两个东西的不兼容,还不能删除第二个,于是尝试把第一个删除掉,不影响当前界面的正常运行,这才算是暂时解决了这个问题,但是在往下深究,却超出了我的能力范围,只能退而求其次,到此为止,在这里记录一下自己碰到的障碍,供日后查阅。

 

另:如果在js中出现$未定义的提示,原因在于没有引用jquery.js或者路径不对,这是唯一的解释,也是出现这个提示错误唯一可能的原因。

附自己的前台界面一张:

bootstrap3添加日期控件中碰到的问题_第2张图片

 

到此为止,已经晚上10:00了,该回去了,早睡早起,方能养生~

更多2019年的技术文章,欢迎关注我的微信公众号:码不停蹄的小鼠松(微信号:busy_squirrel),也可扫下方二维码关注获取最新文章哦~

你可能感兴趣的:(web前端)