使用带触发按钮的jQuery Mobile Date选择器

时间:2014-03-04 08:18:41

标签: jquery-mobile datepicker

我正在使用带有输入标签的标准JQM日期选择器

<input type="date" data-clear-btn="false" id="dp" value="2006-09-14">

请求这里是jsfiddle示例:http://jsfiddle.net/GardenOfEmuna/47VUw/

现在我想在触发按钮中显示值,并在点击它时打开datepicker。

有没有人知道如何使用触发按钮打开日期选择器?

1 个答案:

答案 0 :(得分:1)

您没有使用jqm datepicker,因为没有。您正在使用本机浏览器的datepicker控件,并且无法在this thread

中对其进行触发

可能的解决方案:

我创建了一个jsFiddle,它使用来自jquery ui的datepicker和一个包装类,如jqm文档中所示(link

HTML

<div data-role="page" id="foo">
    <div data-role="content">
           <input id='myDatePicker' type="text" data-role="date">
           <button id='myButton' class="ui-btn">Button</button>   
    </div>
</div> 

JS

$(document).on('pageinit',function(){
    $('#myButton').click(function() {
        $('#myDatePicker').datepicker( "show" );
    });
});

资源

  • jquery.mobile-1.4.2.min.css
  • 的jquery-1.9.1.min.js
  • jquery.mobile-1.4.2.min.js
  • jquery.ui.datepicker.js