Question

我有以下函数生成带有id s和name s的编号输入字段，这些字段是他们创建的当前时间戳。我正在尝试将datepicker附加到每个创建的，因此唯一/时间戳id。

有人可以建议我这样做吗？

我认为需要在创建的每个输入字段下生成datepicker函数，但我不知道如何使用JavaScript生成JavaScript函数。我想也许我可以使用jQuery的load()函数并调用一个PHP脚本来生成一个独特的函数并将其加载到div中。这是解决这个问题的最佳方法吗？谢谢！

<script>
    var number = 0;
    var num;
    $('#add_date').click(function(event) {
    number++;
    var d=new Date();
    var year = d.getFullYear();
    var day = d.getDate();
    var month = d.getMonth() + 1;
    if (month<10){var month = "0"+month;}
    if (day<10){var day = "0"+day;} 
    var fullyear = month+"/"+day+"/"+year;
    num = event.timeStamp
    $('#box').append( number+". <input type='text' id='" + num + "' name='" + num + "' value='"+ fullyear + "' size='10'/><br><br>");
    var idtag = "#"+num;
});
</script>

Answer 1

为什么不在创建输入时设置日期选择器？

var picker = $("<input/>", {
  type: 'text',
  id: num,
  name: num,
  value: fullyear
}).datepicker();

$('#box').append(number).append(picker);

此外，您应该使“id”值看起来像有效标识符而不是普通数字。

Answer 2

看看 @Pointy 的实际解决方案的答案，他比我快，我的答案实际上并不能解决你的问题，我只想提几点注意。< / p>

尝试正确缩进代码，因此在一个月后查看代码时很容易为您阅读。你现在可能已经知道它究竟做了什么，但从长远来看这将是一件痛苦的事。

尽管不太可能，但不能保证同一事件不会在同一毫秒内触发两次，我会避免使用event.timeStamp来生成唯一ID。这只是个人偏好，它可能永远不会发生，我只是不喜欢依靠计时器来获得独特性。你已经增加了number变量，你应该使用它，这肯定是唯一的。

将HTML写入字符串时，我宁愿使用正确的标准标记。使用'作为字符串边界，使用"作为HTML属性。

最后，在if(month<10){...}条件中，不要重新定义已在函数中定义的变量。它可能不会引发错误或产生任何负面影响，但我们只能感谢当前宽松的javascript实现，不应允许在同一范围内重新定义。

最后确保将所有jQuery初始化代码放入jQuery ready函数中，以确保DOM和jQuery本身已完全加载。

抱歉咆哮......;）

$(function(){
    var number = 0;

    $('#add_date').click(function(event) {
        number++;

        var d=new Date();
        var year = d.getFullYear();
        var day = d.getDate();
        var month = d.getMonth() + 1;

        if (month<10) month = "0"+month;
        if (day<10) day = "0"+day;
        var fullyear = month+"/"+day+"/"+year;

        // Insert @Pointy's solution in here...
    });
});

Answer 3

你可以添加一个fict

<input type='text' id='" + num + "' name='" + num + "' value='"+ fullyear + "' size='10' class='fake-class'/>

然后，您可以像这样加载datepicker对象：

$('.fake-class').each(function(){
    $(this).datepicker();
});

希望有所帮助

Answer 4

关于变量num和number的一点修改，@ Pontity使用num而@DarthJDG正在使用数字。这是适合我的完整代码

在剧本中：

   var num = 0;
   $('#btn').click(function(event) {
        <!-- Set the default date to be todays date, can be removed for blank-->
        num++;  
        var d=new Date();
        var year = d.getFullYear();
        var day = d.getDate();
        var month = d.getMonth() + 1;

        if (month<10) month = "0"+month;
        if (day<10) day = "0"+day;
        var fullyear = month+"/"+day+"/"+year;
        <!-- End -->

        var picker = $("<input/>", {
          type: 'text',
          id: num,
          name: num,
          value: fullyear
        }).datepicker();
        $('#holder').append(num).append(picker);
    }

在HTML中：

<input type="button" id="btn" value="button">
<div id="holder">
</div>

jquery加载追加datepicker函数

4 个答案: