Question

我创建了一个日期选择器，其中的flatpickr()日期选择器工作正常。但是我试图在该日期选择器上创建一个onchange事件，但是onchange事件不起作用我曾尝试制作一个类似于myfunction的函数，并在输入中调用它也没有作用

有人可以帮我吗

$('.flatpickr').flatpickr();
			$("#flatpickr-disable-range").flatpickr({
				disable: [
					{
						from: "2016-08-16",
						to: "2016-08-19"
					},
					"2016-08-24",
					new Date().fp_incr(30) // 30 days from now
				]
			});
( ".flatpickr" ).change(function() {
  alert( "Handler for .change() called." );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.7/flatpickr.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<div class="form-group">
							<input class="form-control flatpickr" id="set_exam_date" data-min-date="today" data-date-format="D F j, Y" placeholder="Select Date">
						</div>

Answer 1

首先更改脚本的顺序：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.7/flatpickr.min.js"></script>

然后您在搜索flatpickr之前忘记了jQuery标志：

$( ".flatpickr" ).change(function() {
  alert( "Handler for .change() called." );
});

Answer 2

您必须在HTML代码下方初始化jQuery和flatpickr。您应该在身体的最后使用它。像这样：

 $('.flatpickr').flatpickr();
        $("#flatpickr-disable-range").flatpickr({
          disable: [{
              from: "2016-08-16",
              to: "2016-08-19"
            },
            "2016-08-24",
            new Date().fp_incr(30) // 30 days from now
          ]
        });
        $(".flatpickr").change(function () {
          alert("Handler for .change() called.");
        });

<link href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" rel="stylesheet"/>
      <div class="form-group">
        <input class="form-control flatpickr" id="set_exam_date" data-min-date="today" data-date-format="D F j, Y"
          placeholder="Select Date">
      </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.7/flatpickr.min.js"></script>

flatpickr（）输入未唤醒onchange事件

2 个答案: