Функция добавления даты в jquery load

Question

У меня есть следующая функция, которая создает пронумерованные поля ввода с id с и name с текущей отметки времени, в которой они были созданы.Я пытаюсь прикрепить средство выбора даты к каждому созданному, отсюда и уникальный идентификатор / метка времени.

Кто-нибудь может предложить мне способ сделать это?

Я считаю, что функцию 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

Посмотрите на ответ @ Pointy для реального решения, он был быстрее меня, мой ответ на самом деле не решит вашу проблему, я просто хотел бы отметить несколько моментов, на которые следует обратить внимание.

Постарайтесь правильно сделать отступ в своем коде, чтобы его было легко прочитать, посмотрев его через месяц.Теперь вы можете точно знать, что именно он делает, но в долгосрочной перспективе будет сложно разобраться с этим.

Маловероятно, что нельзя гарантировать, что одно и то же событие не сработает.дважды за одну и ту же миллисекунду я бы не использовал event.timeStamp для генерации уникальных идентификаторов.Это просто личное предпочтение, хотя, вероятно, этого никогда не произойдет, я просто не люблю полагаться на таймеры для уникальности.У вас уже есть инкрементная переменная number, вы должны использовать ее, которая определенно будет уникальной.

При записи HTML в строку я бы предпочел использовать правильную стандартную разметку.Используйте ' в качестве границ строки и " для атрибутов HTML.

Наконец, внутри вашего условия if(month<10){...} не переопределяйте переменную, которую вы уже определили в своей функции.Вероятно, это не выдает ошибку или не окажет какого-либо отрицательного эффекта, но мы можем только поблагодарить текущую прощающую реализацию javascript за это, переопределение не должно быть разрешено в той же области действия.инициализируйте код в функцию готовности jQuery, чтобы убедиться, что 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 2

Почему бы просто не настроить средство выбора даты при создании ввода?

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

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

Также вы должны сделать значения "id", которые выглядят как действительные идентификаторы вместо простых чисел.

Answer 3

Просто небольшое исправление о переменной num и number, @Pointy использовал num, а @DarthJDG использовал number.Вот полный код, который работал для меня

В сценарии:

   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>

Answer 4

Вы можете добавить фикт

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

И затем вы можете загрузить объект DatePicker следующим образом:

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

Надеюсь, это поможет