努力为动态创建的文本框获取日期选择器答案

【问题标题】：Struggling to get datepicker for dynamically created textboxes努力为动态创建的文本框获取日期选择器
【发布时间】：2016-09-20 07:26:23
【问题描述】：

我已经动态生成文本框并尝试分别获取每个文本框的日期选择器。

问题是如果我选择一个文本框并选择日期，它将适用于所有文本框。我不知道如何传递值来获得结果。如果我的英语（或）表达方式有误，请见谅。我会感谢你的帮助。

我调用日历的脚本：

<script type="text/javascript">
$(window).load( function() {

    $('#mycalendar3').monthly({
        mode: 'picker1',
        target: '#mytarget1',
        setWidth: '370px',
        startHidden: true,
        showTrigger: '#mytarget1',
        stylePast: true,
        disablePast: true,
                    xmlUrl: 'events.xml'
    });


                $('#mycalendar2').monthly({
        mode: 'picker1',
        target: '.value1',
        setWidth: '370px',
        startHidden: true,
        showTrigger: '.value1',
        stylePast: true,
        disablePast: true,
                    xmlUrl: 'events.xml'
    });



switch(window.location.protocol) {
case 'http:':
case 'https:':
// running on a server, should be good.
break;
case 'file:':
alert('Just a heads-up, events will not work when run locally.');
}

});

HTML 代码：

 <div style="display:inline-block; width:150px;">
                  <input type="text"  class="value1" id="mytarget" >
        <div class="monthly" id="mycalendar2"></div>
    </div>


              <div style="display:inline-block; width:150px;">
        <input type="text" id="mytarget1">
        <div class="monthly" id="mycalendar3"></div>
    </div>

【问题讨论】：

没有发现上述代码有任何问题。这篇文章中是否缺少任何其他代码？文本框是如何动态生成的？能否请您出示该代码？
Event binding on dynamically created elements?的可能重复
jsfiddle.net/ssoundar619/eav8hLwm/1
请参考此链接 Vijay。我已将我的整个代码粘贴在那里。
如果您使用$(window).load( 设置事件，但文本框是“动态”生成的 - 很有可能它们是在您之后生成的试图转换它们（代码不在问题中）。在 .monthly 调用之前添加 alert($('#mycalendar3').length) 以查看它们是否存在。

标签： javascript php jquery datepicker

【解决方案1】：

您需要在事件上使用 jquery，我在这里创建了演示小提琴，

$(function() {
  $("#datepicker").datepicker();
  $("button").on('click', function() {
    $('.output').append('<input type="text" name="gentext" id="gent" />');
    $("#gent").datepicker();
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3>Normal input datepicker</h3>
<p>Date:
  <input type="text" id="datepicker">
</p>
<button>generate</button>
<h3>Generated input datepicker</h3>
<div class="output"></div>

请在您的代码上应用相同的事件，它将适用于生成的输入。

【讨论】：