Question

我希望能够使用javascript查看使用Metro UI CSS datepicker选择的日期。最终，此数据将用于构建要在AJAX请求中发送的JSON对象。但就目前而言，我很乐意在浏览器警报消息中看到它。

这是datepicker控件：http://metroui.org.ua/datepicker.html 请注意，第二个datepicker有一个默认值。

如何使用浏览器控制台将该默认值转换为警告消息？当然我错过了一些明显的东西，但我没有运气，比如检查输入元素的“val()”等等。

Answer 1

我刚刚发现了一些解决方法（快速而又脏）：向<input type="text"...中的<div class="input-control text"...提供一个唯一的ID，然后让JQuery制作魔法！这是代码：

<div id="dpContainer" class="input-control text">
    <input id="inputToRead" type="text">
    <button class="btn-date"></button>
</div>

<script>
    function getDPValue(){
      var selectedDate = $('#inputToRead').val();
      return selectedDate;
    }
</script>

我知道它有点脏，可能你可以从http://metroui.org.ua/calendar.html函数中得到一些有用的提示。

更快更脏：

<script>
  function getDPValue(){
    return $('#dpContainer').children('input[type=text]').val();
  }
</script>

HTH，斯特凡诺。

Answer 2

datepicker 内部有一个日历控件。您可以获取运行.calendar（＆＃39; getDate＆＃39;）的日历控件的选定日期。然后让我们允许JQuery完成他的工作并到达 datepicker 中的 calendar 控件。

<div id="myDate" class="input-control text" data-role="datepicker" data-preset="2016-01-01">
    <input type="text">
    <button class="button"><span class="mif-calendar"></span></button>
</div>

<script>
    function getMyDate(){
        return $('#myDate .calendar').calendar('getDate');
    }
</script>

<button class="button" onclick="alert(getMyDate())">Show My Date</button>

如何使用javascript获取MetroUI CSS Datepicker值

2 个答案: