以正确的方式包含JavaScript

时间:2017-07-17 05:35:59

标签: javascript php jquery

问题是我收到错误:

  

TypeError:$(...)。datetimepicker不是函数

当我试图在我的页面中添加datetimepicker时,经过深入搜索解决方案后,我发现我必须以正确的方式包含JS,但经过几个小时的尝试后我仍然无法得到正确的答案,希望有人可以帮助我..

这是我的页面形式> asset.php:

<div class="form-group">
   <label>Aq Date</label>
   <div class='input-group date' id='datetimepicker1'>
      <input type='text' class="form-control" />
      <span class="input-group-addon">
      <span class="glyphicon glyphicon-calendar"></span>
      </span>
   </div>
   <p class="help-block">Help text here.</p>
   <button type="submit" class="btn btn-info">Send Message </button>
</div>

datepick.js

    $(function () {
   var bindDatePicker = function() {
        $(".date").datetimepicker({
        format:'YYYY-MM-DD',
            icons: {
                time: "fa fa-clock-o",
                date: "fa fa-calendar",
                up: "fa fa-arrow-up",
                down: "fa fa-arrow-down"
            }
        }).find('input:first').on("blur",function () {
            // check if the date is correct. We can accept dd-mm-yyyy and yyyy-mm-dd.
            // update the format if it's yyyy-mm-dd
            var date = parseDate($(this).val());

            if (! isValidDate(date)) {
                //create date based on momentjs (we have that)
                date = moment().format('YYYY-MM-DD');
            }

            $(this).val(date);
        });
    }

   var isValidDate = function(value, format) {
        format = format || false;
        // lets parse the date to the best of our knowledge
        if (format) {
            value = parseDate(value);
        }

        var timestamp = Date.parse(value);

        return isNaN(timestamp) == false;
   }

   var parseDate = function(value) {
        var m = value.match(/^(\d{1,2})(\/|-)?(\d{1,2})(\/|-)?(\d{4})$/);
        if (m)
            value = m[5] + '-' + ("00" + m[3]).slice(-2) + '-' + ("00" + m[1]).slice(-2);

        return value;
   }

   bindDatePicker();
 });

并在我的asset.php中包含JS

<!-- FOOTER SECTION END-->
<!-- JAVASCRIPT FILES PLACED AT THE BOTTOM TO REDUCE THE LOADING TIME  -->
<!-- CORE JQUERY  --> 
<script src="assets/js/jquery-1.10.2.js"></script>

<!-- BOOTSTRAP SCRIPTS  -->
<script src="assets/js/bootstrap.js"></script>

<!-- DATATABLE SCRIPTS  -->
<script src="assets/js/dataTables/jquery.dataTables.js"></script>
<script src="assets/js/dataTables/dataTables.bootstrap.js"></script>
<script src="assets/js/dataTables/datable.serverside.js"></script>

<!-- CUSTOM SCRIPTS  -->
<script src="assets/js/custom.js"></script>
<script src="assets/js/datepick.js"></script>

1 个答案:

答案 0 :(得分:2)

你应该包括Datepicker插件 请参阅此https://formden.com/blog/date-picker