Jquery 日期选择器需要被选择两次

Question

感谢您抽出时间来帮助我。我希望获得帮助的是我的日期选择器。我正在构建一个用作电子邮件模板的小型网络表单。所以我的想法是填写表格，点击创建，然后用表格信息填充电子邮件。但是，我的日期选择器要求我两次 select 日期，直到将正确的日期打印到电子邮件中。第一个 selection 将无结果，第三次尝试将导致第二个 selection 输出，依此类推。

我使用的是Jquery1.12.4，我的代码如下：

JS:

    $(function(){
        $( "#IncidentDateInput" ).datepicker({
                  dateFormat: 'dd/mm/yy'
            }); 
    });


    function updateMailString() {           
            mailString = '?subject=' + encodeURIComponent($('#subject').val())
                + '&body=Agent Name: ' + encodeURIComponent($('#AgentNameInput').val()) 
                +"%0D%0AMDN: " +encodeURIComponent($('#MDNInput').val())
                +"%0D%0ADevice: " +encodeURIComponent($('#DeviceInput').val())
                +"%0D%0AIssue: " +encodeURIComponent($('#IssueInput').val())
                +"%0D%0ADate: " +encodeURIComponent($('#IncidentDateInput').val());
            var receiver = encodeURIComponent($('#ReceiverInput').val());
            $('#mail-link').attr('href',  'mailto:' + receiver + mailString);
        }


$( "#IncidentDateInput" ).focusout(function() { updateMailString(); });

Html:

<input type="text" id="IncidentDateInput"  />

任何见解都会很棒，谢谢。

Answer 1

尝试使用 change 而不是 focusout。当使用 focusout 输入保持为空并调用 updateMailString 函数。在使用 change 函数时，在更改输入（日期选择器）后，将调用 updateMailString 函数

Fiddle link

$(document).ready(function() {
  $('#IncidentDateInput').datepicker({
    dateFormat: 'dd/mm/yy',
  });
  $("#IncidentDateInput").change(function() {
    updateMailString();
  });
})

function updateMailString() {
  mailString = '?subject=' + encodeURIComponent($('#subject').val()) + "%0D%0ADate: " + encodeURIComponent($('#IncidentDateInput').val());
  var receiver = encodeURIComponent($('#ReceiverInput').val());
  $('#mail-link').attr('href', 'mailto:' + receiver + mailString);
  alert($('#mail-link').attr('href'))
}

Jquery 日期选择器需要被选择两次

Jquery datapicker requires to be selected twice

html

javascript

jquery

html-email