ブートストラップとともにdatetimepickerを使用しようとしましたが、動作しません。 Uncaught TypeError：$（...）。datetimepickerは関数ではありません

他の質問に対する答えを見て、さまざまな解決策を試しましたが、何も効果がありませんでした。

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> 
 
    <title>Call Report Generator</title> 
 

 
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 

 
    <!-- Bootstrap --> 
 
    <!-- Latest compiled and minified CSS --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" /> 
 

 
    <!-- Optional theme --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
 
    <link rel="stylesheet" href="main.css"> 
 

 
    <!-- Latest compiled and minified JavaScript --> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 

 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
 
    <!--[if lt IE 9]> 
 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
 
    <![endif]--> 
 
</head> 
 

 
<body> 
 

 
    <div class="heading"> 
 
     <h1 align="center">Call Report Generator </h1> 
 
    </div> 
 

 
    <div class="nav"> 
 
     <div class="container"> 
 
      <ul class="pull-left"> 
 
       <li><a href="#">Home</a></li> 
 
      </ul> 
 
      <ul class="pull-right"> 
 
       <li><a href="#">Help</a></li> 
 
      </ul> 
 
     </div> 
 
    </div> 
 

 
    <div class="container-fluid"> 
 
     <!-- If Needed Left and Right Padding in 'md' and 'lg' screen means use container class --> 
 
     <div class="row"> 
 
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4"> 
 
       <a href="#">Start Date</a> 
 
       <div class="container"> 
 
        <div class="row"> 
 
         <div class='col-sm-4'> 
 
          <div class="form-group"> 
 
           <div class='input-group date' id='datetimepicker1'> 
 
            <input type='text' class="form-control" /> 
 
            <span class="input-group-addon"> 
 
\t \t \t \t \t \t \t <span class="glyphicon glyphicon-calendar"></span> 
 
            </span> 
 
           </div> 
 
          </div> 
 
         </div> 
 
        </div> 
 
       </div> 
 
      </div> 
 

 
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4"> 
 
       <a href="#">End Date</a> 
 
      </div> 
 
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4"> 
 
       <a href="#">Provider</a> 
 
      </div> 
 
     </div> 
 
    </div> 
 

 
</body> 
 

 
<script type="text/javascript"> 
 
    $(function() { 
 
     $('#datetimepicker1').datetimepicker(); 
 
    }); 
 
</script> 
 

 
</html>

私はこの質問は前に述べた、さまざまなソリューションを試みたが、何も働いていないため、他のソリューションを見てみました。

出典

2017-07-25 artemisFalcon

を:) – 0mpurdy

"datetimepicker"プラグインのJavascriptファイルが含まれているかどうかを確認しましたか？ "datetimepicker"ファイルjavascriptタグを "datetimepicker"関数を使用しようとしているコードの前に含めてください。

出典

2017-07-25 18:27:16 Gomosoft

あなたにもjavascriptのブートストラップのDateTimePicker含める必要があります：あなたは、あなたが見ているとその解決策あなたが試してみました質問追加することができます

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>

出典

2017-07-25 18:27:20

ブートストラップとともにdatetimepickerを使用しようとしましたが、動作しません。 Uncaught TypeError：$（...）。datetimepickerは関数ではありません

答えて

関連する問題