Question

请帮助我，我很无能为力。当我尝试打开jquery UI的日期选择器并将其附加到输入标签时，它可以很好地工作，但是当我尝试将它附加到textarea时，没有任何事情发生。

<script type="text/javascript">
     $(function() {    $("#${data_picker}").datepicker();  });
</script>

---- This will work ----
<input id="data_picker" />

---- This doesn't work ----
<textarea id="data_picker"></textarea>

为什么???

P.S 当然，它们不是在同一页面中，它只是页面中的输入或仅是textarea。

Answer 1

简短版本：<textarea>元素不支持datepicker，特别是<span> and <div> elements支持inline mode和only <input> elements。以下是执行这些检查的相关代码：

var nodeName = target.nodeName.toLowerCase();
var inline = (nodeName == 'div' || nodeName == 'span');
if (!target.id) {
  this.uuid += 1;
  target.id = 'dp' + this.uuid;
}
var inst = this._newInst($(target), inline);
inst.settings = $.extend({}, settings || {}, inlineSettings || {});
if (nodeName == 'input') {
  this._connectDatepicker(target, inst);
} else if (inline) {
  this._inlineDatepicker(target, inst);
}

Answer 2

我实现了一种方法，可以在我的应用中为textareas使用datepicker。

我在html代码中添加了一个输入文本字段，style="display:none"，以便隐藏此字段，但日历按钮显示为图像。用户点击图像，当他选择日期时，我在下面实现了'onSelect'功能，将值添加到文本区域。我认为原始实现使用.append（）将值添加到输入文本..这就是为什么它不适用于textareas ...我的解决方案是使用val（）并且它按预期工作，所以我与你分享

jQuery(inputEl).datepicker({
        showOn: "button",
        buttonImage: "../image/calendar.gif",
        buttonImageOnly: true,
        buttonText: "",
        onSelect: function(selectedDate) {
            var textStr = jQuery(txtAreaEl).val();
            textStr = selectedDate;
            jQuery(txtAreaEl).val(textStr);
        } 
    });

为什么jquery datepicker不能在textarea上工作，只能在输入上工作

2 个答案: