HTML 5 datepicker事件未在iOS Safari上开火

Question

im试图实现一个日期选择器，以更新图形，并从特定时间点使用一些信息。使用jQuery Ive尝试了Onblur Onchange和Onkeyup，但这些事件似乎都没有在移动Chrome或ios Safari上开火。

i然后尝试 onblur = 也没有成功。

任何人都可以看到我在这里做错了什么？

  <div class="col-50 graph-date-select-container">
    <input id="graph-date-input" type="date" class="graph-date-select" style="-webkit-appearance: textfield; -moz-appearance: textfield; height: 20px; margin-top: -15px;" onblur="graphUpdate()"/>
  </div>

function graphUpdate() {
  alert("graphUpdate called.")
  var date = new Date($(this).val());
  var dateString = "" + date.getDay() + "/" + date.getMonth() + "/" + date.getFullYear();
  var url = "{% add_params request.get_full_path period='daily'%}" + "query_param=" + dateString
  window.location.href = url
};

本质上需要发生的所有事情是，当更改输入中的值（用户隐藏日期输入弹出）时，DAT作为param作为DJANGO模板的参数传递，并且页面重新加载带有新信息。

Answer 1

您应该遵循我的代码，它将有效：:

html

<div class="col-50 graph-date-select-container">
    <input id="graph-date-input" type="date" class="graph-date-select" style="-webkit-appearance: textfield; -moz-appearance: textfield; height: 20px;" onchange="graphUpdate(this.value)"/>
</div>

JS

function graphUpdate(value) {
    var date = new Date(value);
    console.log(date);
    var dateString = "" + date.getDay() + "/" + date.getMonth() + "/" + date.getFullYear();
    var url = "{% add_params request.get_full_path period='daily'%}" + "query_param=" + dateString;
    window.location.href = url;
};

remeber这将打印您选择的日期，其余的代码，您需要根据需要更改。

==================================================================================

更新版本:: 请尝试这个

html

<div class="col-50 graph-date-select-container">
    <input id="graph-date-input" type="date" class="graph-date-select" style="-webkit-appearance: textfield; -moz-appearance: textfield; height: 20px;"/>
</div>
<div id="testingDiv"></div>

JS

$(document).ready(function () {
    $(document).on('change', '.graph-date-select', function () {
        var date = new Date($(this).val());
        $('#testingDiv').html(date);
        alert(date); //first check date is alerting or not
        return false;
        var dateString = "" + date.getDay() + "/" + date.getMonth() + "/" + date.getFullYear();
        var url = "{% add_params request.get_full_path period='daily'%}" + "query_param=" + dateString;
        window.location.href = url;
    });
});