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的“审查元素”中调试，出现的错误如下：

 

<script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>

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

 

 

 

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

 

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

附自己的前台界面一张：

 

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

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