jquery日期选择器显示与值不同的文本

jquery datepicker show text that is different from value

本文关键字：文本 日期 选择器 显示 jquery      更新时间：2023-09-26

我当前正在使用日期选择器。由于有时我想显示一些文本，而不是我从日期选择器中选择的日期，有人知道是否有办法做到这一点吗？非常感谢！

例如：如果2015/01/01是一个假日，并且我选择了这个日期，我希望在输入元素上显示假日名称，而不是2015/01-01。当我提交时，值（2015/01/01）仍将传递到服务器中。

我在谷歌上搜索过，但还没有找到一个好的解决方案。

您可以将所选日期存储在另一个字段中，并使用onSelect事件检查和覆盖所选值。

$("#datepicker").datepicker({
    altField: "#actualDate",
    onSelect: function(dateText, inst) {
        if (dateText.substring(0, 5) == "04/01") {
            inst.input.val("april fools!");
        }
    }
});
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
<input id="datepicker" type="text">
<br>
<input id="actualDate" type="text">

最干净的方法是完全实现自己的日期选择器。

接下来是破解日期选择器，例如

var that = this;
this.$input.datepicker({
    onSelect: function () {
        // get value, e.g. "2015-10-14"
        // check if that date is mapped to any holiday
        that.$input.val("St. Patrick Day 2015");
    },
});

当你得到这个的时候$input.val（）要使用它，必须手动将"2015年圣帕特里克节"翻译回"2015-10-14"。

有点丑陋vs建立自己的。

相关文章：