1. ホーム
  2. jquery-ui

[解決済み] datetimepickerは、関数jqueryではありません。

2022-02-25 03:19:25

質問

datetimepicker jquery uiで作業していますが、以下のhtmlのコードでは、datetimepickerは表示されませんし、私がで検査するとき firebug console というエラーが表示されました。

$("#example1").datetimepicker is not a function
[Break On This Error] $("#example1").datetimepicker(); 

そして以下はそのコードです。

<link href="css/styles.css" rel="stylesheet" type="text/css">
<link href="css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css">

<style>
    .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }

    .ui-timepicker-div dl { text-align: left; }
    .ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
    .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }          
    .ui-timepicker-div td { font-size: 90%; }           
    .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }                   

</style>


<script type="text/javascript" src="scripts/jquery.js"></script>

<script type="text/javascript" src="scripts/jquery/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-sliderAccess.js"></script>

<script>
    $(document).ready(function(){
        $("#example1").datetimepicker();
    });
</script>

<script>

</script>

<input type="text" id="example1" class="hasDatePicker">

解決方法は?

jQuery UIのdatepickerはdatetimepicker()で初期化されないので、ここにプラグイン/アドオンがあるようなので、注意してください。 http://trentrichardson.com/examples/timepicker/ .

しかし、jquery-uiだけでは、実際には、次のように初期化されます。 $("#example").datepicker() . jQueryのデモサイトはこちらです。 http://jqueryui.com/demos/datepicker/

   $(document).ready(function(){
        $("#example1").datepicker();
    });

上記のリンクにあるdatetimepickerを使用するには、プラグインのスクリプトのパスが正しいことを確認する必要があります。