Question

我有一个简单的按钮：

<input type=button class=datepicker value='Select Date for payroll' />
<input type=button class=datepicker value='Select Date for ?' />
<input type=button class=datepicker value='Select Date for >' />

我附加了一个jQuery的Datepicker：

$('.datepicker').datepicker();

但默认操作是在选择日期时更改按钮的文本/值。我想保留默认值。这可能吗？

我有多个按钮需要打开一个日期选择器。在Datepicker上选择日期时，它将触发一个函数并处理该值。但我不希望选择的值在任何地方更新。必须在点击按钮时触发。

Answer 1

您可以使用datepicker-widget的shownOn - 选项：

<强>的jQuery

 $("#datepicker").datepicker({
    showOn: "button",
    buttonText: "Select date",
    onSelect: function(dateText){
        alert(dateText + ' selected');
    }
});

注意：onSelect函数的参数始终为string

类型

<强> HTML

<input type="hidden" id="datepicker" />

<强> Demo

<强>参考

buttonText

datepicker - icon trigger

onSelect

Answer 2

您可以隐藏输入并使用showOn属性

<强> HTML ：

<input style="display:none;" type=button id=datepicker value='Select Date' />

<强> JS ：

$("#datepicker").datepicker({
    showOn: "button",
    buttonText: "Select date"
});

DEMO：https://jsfiddle.net/ogavr7gq/2/

Answer 3

您可以尝试这样的事情：

HTML：

<input type="hidden" id="datepicker" />

JavaScript的：

$("#datepicker").datepicker({
    showOn: "button",
    buttonText: "Select date"
});

$("#datepicker").on("change", function(e) {
    e.preventDefault();
    e.stopPropagation();
    alert("Changed to: " + $(this).val());
});

在这里小提琴：https://jsfiddle.net/robbyn/9oq2wp8j/

防止jQuery的Datepicker改变按钮的值

3 个答案: