javascript - 在 jquery 中第二次单击时执行函数

Question

我有一个日历按钮，单击它会打开一个日期选择器并将日期放入输入文本框中。我想要发生的事情是让第二个文本框自动填充 future 30 天后的日期。我遇到的问题是让它与 jquery 一起工作。

HTML:

<tr>
<td align = "center">Entry Date From:  <input id="ENTRYDATEFROM" name="ENTRYDATEFROM" type="text" maxLength="10" size="12" value="">
<img height="20"src="calendarsrc" id="entrySrc"></td>
<td align = "center">Entry Date To:   <input id="ENTRYDATETO" name="ENTRYDATETO" type="text" maxLength="10" size="12" value="">
<img height="20"src="calendarsrc" id="entrySrc2"></td>
</tr>

JQUERY:

$(document).ready(function() {

  $("#entrySrc").click(function(){
     gAnytime.fPopCalendar(document.myform.ENTRYDATEFROM);
  });

  $("#entrySrc2").click(function(){
     gAnytime.fPopCalendar(document.myform.ENTRYDATETO);
  });

  //Tried this but had no success
  //$(document).on("change", "#entrySrc", populate);


});

function populate(){
 var q = $("#ENTRYDATEFROM");
 var dateTo    = new Date(q.val()); 
 var newDate   = new Date(dateTo.setDate(dateTo.getDate() + 30));
 var formatted = padNumber(newDate.getUTCMonth() + 1) + '-' + padNumber(newDate.getUTCDate()) + '-' + newDate.getUTCFullYear();
 $("#ENTRYDATETO").val(formatted);
}

function padNumber(number) {
  var string  = '' + number;
  string      = string.length < 2 ? '0' + string : string;
  return string;
}

这是我的 GUI 在点击任何东西之前的样子:

这是当我单击位于输入文本框右侧的#entrySrc 日历按钮时发生的情况

然后我可以在该日历框中单击我希望的任何日期。这将填充其左侧的输入文本框。

如何在日历框内的第二次点击上/针对第二次点击执行我的填充函数？

Answer 1

对此可能有一个非常简单的解决方案:在#entrySrc 更改 时简单地触发 populate() 方法。

$(document).on("change", "#entrySrc", populate);

或以下替代方案之一:

$("#entrySrc").on("change", populate);
$("#entrySrc").change(populate);

请注意，您传递的是 populate，而不是 populate()。