使用 jQueryUI 获取日期选择器值

Posted 2023-05-07

【中文标题】使用 jQueryUI 获取日期选择器值

【英文标题】：Get datepicker value using jQueryUI

【发布时间】：2011-10-03 18:34:28

【问题描述】：

使用jQuery UI，当它在表单中这样使用时，如何在http post中获取日期选择器的值：

<div id="datepicker"></div>

【参考方案1】：

$('#datepicker').datepicker(
    onSelect: function(dateText, inst) 
      $("input[name='something']").val(dateText);
    
);

这是一个小提琴：http://jsfiddle.net/jensbits/9hbmy/338/

【讨论】：

谢谢，太好了。感谢您的小提琴，使其更容易理解！ +1

【参考方案2】：

你在找这个吗？

$("#datepicker").datepicker("getDate");

【讨论】：

通常我只是把东西放在像<input type="hidden" name="something" value="thevalue" /> 这样的隐藏输入中，然后发布到表单操作中。我怎样才能使用它，但把它放在表单中？

【参考方案3】：

初始化：

$( "#datepicker" ).datepicker( dateFormat: "yy-m-dd" );

获取价值：

$("#datepicker").datepicker().val() //2014-4-15

查看格式设置：

http://api.jqueryui.com/1.9/datepicker/#option-dateFormat

【参考方案4】：

您应该将日期选择器绑定到表单输入而不是 div，因此输入中的值将与表单一起提交。

<input type="text" id="datepicker"></div>

<script>
    $(function () 
        $('#datepicker').datepicker();
    );
</sript>

【讨论】：

@ing0 如果您的限制阻止您使用文本输入来捕获日期，您将希望使用 altField 属性在隐藏的输入中捕获日期或提供onSelect 回调，按照 Thorsten 和 Jen 的建议，在所选日期执行您需要的操作。

谢谢，我就是这么做的。去 onSelect 回调。

【参考方案5】：

添加一个隐藏字段并将其添加到“altField”选项应该可以做到。

编辑：您可能还想查看此解决方案：

html：

<div id="datepicker">KLICK ME</div>
<input type="hidden" id="hidde_date_field" />

javascript：

$('#hidde_date_field').datepicker();

$('#datepicker').click(function() 
    $('#hidde_date_field').datepicker( "show" );
);

【参考方案6】：

这对我来说效果很好：

$("#datepicker").find(".active").attr("data-date")