Question

我正在对一个表进行内联编辑，并且我有一个发行者，其中一个单元格必须在用户点击时显示datepicker。当我单击单元格时，编辑文本框是替换的，但是当我在文本框中单击时，日期选择器不会出现。谢谢你的帮助。干杯

  $('.editable').live({
          hover: function () {
              //alert('Am hovering');
              //change background of an editable element if mouse hover
              $(this).toggleClass('over-inline');
          },
          click: function (e) {
           //start inline editing
              var $editable = $(this);

              if ($editable.hasClass('active-inline')) {
                  return;
              }
              var contents = $.trim($editable.html());
              initialValue = contents;
              var itemID = $editable.attr('id');
              var editID = 0;
              var s = '';
               $editable
                  .addClass('active-inline')
                  .empty();

                  //define the edit element
                  var editElement = '<input type="text" class="showDatePicker" />';
                  displayDatePicker('.showDatePicker');
                  $(editElement)
                    .val(initialValue)
                    .appendTo($editable)
                    .focus();
                  //addEditButtons($editable); function that add save/delete/cancel buttons
        }



      function displayDatePicker(selector) {

          $(selector).datepicker({
              showOn: "both",
              buttonImage: "images/calendar.gif",
              buttonImageOnly: true,
              changeMonth: true,
              changeYear: true
          });
          $(selector).datepicker("option", "dateFormat", 'dd.mm.yy');
      }

Answer 1

就像我在上面的评论中所说的那样，首先要改变你做事的顺序：

附加新创建的文本框;
调用将hasDatepicker类添加到元素的函数;

同时更改文本框的类，使其如下所示：

var editElement = '<input type="text" class="Datepicker" >';

然后你用这种方式调用函数：

displayDatePicker('.Datepicker');

干杯

jquery在内联编辑时显示datepicker

1 个答案: