【js】datetimepickerのonCloseについて

###ヘディングのテキスト###前提・実現したいこと
datetimepickerのonCloseを1度だけ処理したいです。

###発生している問題・エラーメッセージ

コンソールに1行出力される想定でしたが、3行出力されてしまいます。
『console.log(date);』にブレイクポイントを設定して確認すると1度しか通りませんでした。

###該当のソースコード

<!DOCTYPE html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>datePicker</title>
	<link rel="stylesheet" type="text/css" href="datetimepicker-master/jquery.datetimepicker.css"/ >
	<script src="datetimepicker-master/jquery.js"></script>
	<script src="datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
	<script type="text/javascript">
		$(function() {
			$.datetimepicker.setLocale('ja');
			$('#datepicker').datetimepicker({
				onClose:  function (date) {
					console.log(date);
				}
			});
		});}
	</script>
</head>
<body>
	<input type="text" id="datepicker" value="">
</body>
</html>

###試したこと
setTimeoutをonClose内で設定してみましたが、結果は変わりませんでした。

###補足情報(言語/FW/ツール等のバージョンなど)
Google Chrome 60.0.3112.101

以下がdatetimepickerダウンロード先のURLです。
https://github.com/xdan/datetimepicker

kei344

2017/09/03 17:22

プラグイン／ライブラリは似た名前のものもあるため、取得した場所のURLを質問文に追記ください。（URLにはリンクを張ることができます）

g_c

2017/09/04 03:13

ご指摘ありがとうございます。URLを追加いたしました。

行動規範の内容に同意します

回答2件

ベストアンサー

上の方が仰っているようにまだ未解決の問題っぽいですね〜。

とりあえずstackoverflowの回答を元に修正してみたんでよろしかったらどうぞー！

html
1<!DOCTYPE html>
2<head>
3  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
4  <title>datePicker</title>
5  <link rel="stylesheet" href="datetimepicker-master/jquery.datetimepicker.css">
6  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
7  <script src="datetimepicker-master/build/jquery.datetimepicker.full.min.js"></script>
8  <script type="text/javascript">
9    $(function() {
10      jQuery.datetimepicker.setLocale('en');
11      lastJqueryTS = 0;
12
13      $('#datepicker').datetimepicker({
14        onClose:  function (date) {
15          var firstCall = true;
16          // 最後に呼ばれた時間から300ms以内だったら連続呼び出しと判定する
17          if ((new Date()).getTime() - lastJqueryTS < 300){
18            firstCall = false;
19          }
20
21          lastJqueryTS = (new Date()).getTime();
22
23          if(firstCall){
24            console.log('called here');
25          }
26        }
27      });
28    });
29  </script>
30</head>
31<body>
32  <input type="text" id="datepicker" value="">
33</body>
34</html>
35

投稿2017/09/04 03:46

MasakazuFukami

総合スコア1869

g_c

2017/09/04 12:47

ご回答と処理内容まで記載して頂きありがとうございます。記載頂いた処理を組み込んだ後、自分でも処理を考えてみます。

MasakazuFukami

2017/09/04 13:04

はい！頑張ってください！また何かあれば質問してみてください！(๑•̀ㅂ•́)و✧t

行動規範の内容に同意します

すでに問題があがっているようですが、解決されていません。
何度呼ばれてもいい作りにするしかないのではないでしょうか？
https://github.com/xdan/datetimepicker/issues/363
https://github.com/xdan/datetimepicker/issues/510

投稿2017/09/04 03:22