Добавьте новую строку даты на страницу jsp с помощью javascript

#javascript #jquery #html #jsp

#javascript #jquery #HTML #jsp

Вопрос:

Я пытаюсь добавить новую строку на страницу jsp, нажав на гиперссылку.

Он работает нормально, но в новой строке функция даты class="dateTxt" не работает. Ниже приведены подробные сведения о функциях jsp и javascript.

javascript:

 function addNewRow(addingNewRow){

    var table = document.getElementById("addingNewRow");
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    var cell4 = row.insertCell(3);
    var cell5 = row.insertCell(4);
    var cell6 = row.insertCell(5);
    var cell7 = row.insertCell(6);
    cell1.innerHTML = cell1.innerHTML   '<td><input type="number" value="" size="10"></td>';
    cell2.innerHTML = cell2.innerHTML   '<td><input type="number" value="" size="10"></td>';
    cell3.innerHTML = cell3.innerHTML   '<td><input type="number" value="" size="10"></td>';
    cell4.innerHTML = cell4.innerHTML   '<td><input type="number" value="" size="10"></td>';
    cell5.innerHTML = cell5.innerHTML   '<td><input id="effDate3" class="dateTxt" type="text" ></td>';
    cell6.innerHTML = cell6.innerHTML   '<td><input id="discDate3" class="dateTxt" type="text" ></td>';
    cell7.innerHTML = cell7.innerHTML   '<td><select id="action" name="actionId"><option value="-1" selected="selected">--Select One--</option><option value="0" >Add</option><option value="1" >Edit</option><option value="2" >Delete</option></select></td>';
}
  

Функция даты:

 $(function(){$('.dateTxt').datepicker({dateFormat: 'yy-mm-dd'}); }); 
  

Jsp:

 href="#" onclick="addNewRow('addingNewRow')">Add More Parameters
  

Ответ №1:

Вам необходимо инициализировать указатель даты для новой строки. Выполните эту строку

 $(function(){$('.dateTxt').datepicker({dateFormat: 'yy-mm-dd'}); });
  

в конце вашей addNewRow() функции. Это будет работать, но также вам следует прочитать о jquery.on() привязке событий к динамическим дочерним элементам.

Комментарии:

1. Но я уже определил эту функцию в теге script. Почему он не выбирался оттуда.

2. потому что новая строка не существует в DOM при инициализации плагина. Вам нужно «распространить» событие на новые элементы, которые вы добавляете в DOM.