Datepicker для динамически добавленных элементов с .on()

Я загружаю HTML динамически, когда нажимается кнопка. Затем этот html отображается в модальном окне. Он содержит элемент <input type="text" class="datepicker"/>, для которого я хотел бы добавить датупик. Я помню, что jQuery использовался для поддержки .live() для такого рода материалов, но это было заменено на on(). Однако, я не знаю, как правильно использовать on():Datepicker для динамически добавленных элементов с .on()

$('.datepicker').on('load', function() { $(this).datepicker(); });

не работает.

источник

2013-09-06 doque

'.live' и' .on' работают только для обработчиков событий. Просто вызовите '.datepicker()' после того, как вы добавили элементы в DOM. –

Я точно пытаюсь избежать повторного вызова .datepicker() для каждого добавленного элемента. – doque

Вы * имеете *, чтобы называть его так или иначе. –

Вы можете попробовать это также

$(function(){ 
     $(document).on("click", ".datepicker", function(){ 

      if (!$(this).hasClass("hasDatepicker")) 
      { 
       $(this).datepicker(); 
       $(this).datepicker("show"); 
      } 
     }); 
    });

источник

2013-09-06 07:47:38 rohitcopyright

Не будет ли это вызвано каждый раз, когда я нажимаю где-нибудь в документе? – doque

нет, поскольку мы прошли конкретный селектор во включенной функции. – rohitcopyright

вам необходимо использовать синтаксис делегирования событий в .on()

(document).on('focusin', '.datepicker', function() { $(this).datepicker(); });

источник

2013-09-06 07:34:52

Что такое 'focusin'? – Itay

@Itay [focusin] (https://developer.mozilla.org/en-US/docs/Web/Reference/Events/focusin) аналогичен фокусу –

Прохладный. И вам, вероятно, не хватает '' 'в начале. – Itay

На самом деле я использовал код JavaScript. для datepicker для динамически созданных текстовых полей. Я не могу выбрать дату в текстовом поле (2-я строка). Я посылаю мой код может у пожалуйста, проверьте и скажите мне

// вот Javascript для Datepicker

$(function() { 
    $(".datepicker").datepicker({ 
     yearRange: "1980:c", 
     maxDate: "+0D", 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: "mm/dd/yy", 
     //showOn: "button", 
     //buttonImage: "Images/calendar.gif", 
     buttonImageOnly: true 
    }); 

       $('.timepicker').timepicker({ 
       timeFormat: 'hh:mm' 
       }); 
});

и Javacript для addrows динамически

function addRow(tableID) { 


     var table = document.getElementById(tableID); 

     var rowCount = table.rows.length; 
     var row = table.insertRow(rowCount); 

     var colCount = table.rows[2].cells.length; 


     for(var i=0; i<colCount; i++) { 

      var newcell = row.insertCell(i); 

      newcell.innerHTML = table.rows[2].cells[i].innerHTML; 
      //alert(newcell.innerHTML); 
      //alert(newcell.childNodes); 
      switch(newcell.childNodes[0].type) { 
       case "text": 
       case "hidden": 
         newcell.childNodes[0].value = ""; 
         break; 
       case "checkbox": 
         newcell.childNodes[0].checked = false; 
         break; 
       case "select-one": 
         newcell.childNodes[0].selectedIndex = 0; 
         break; 
       case "textarea": 
         newcell.childNodes[0].value = ""; 
         break; 
      } 
     } 
    }

HTML для добавления строк с помощью таблицы идентификатора

<td><input id="date" type="text" name="date[]" class="datepicker" size="10" value="<?php echo Convert_Date($rows1['date']); ?>"/></td>

источник

2014-03-20 07:27:51 user3440817

Datepicker для динамически добавленных элементов с .on()

ответ

Смежные вопросы