Question

您好我是jQuerymobile的新手。我正在尝试实现一个日期选择器，需要弹出一个单击文本框的弹出窗口。但是onSelect不起作用，并且没有发生任何点击操作。代码是

<head>
<meta charset="utf-8">

<!-- Need to get a proper redirect hooked up. Blech. -->



<meta name="viewport" content="width=device-width, initial-scale=1">
<title>RideMix</title>
<link rel="stylesheet"  href="jquery.mobile-1.3.2.min.css">
<link rel="shortcut icon" href="demos/_assets/favicon.ico">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">


<link rel="stylesheet" href="jquery.ui.datepicker.mobile.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothnes/jquery-ui.css" />   
<script src="jquery.js"></script>

<link rel="stylesheet" href="style.css">

<script>
    $( document ).on( "pageshow", function(){
        $( "p.message" ).hide().delay( 1500 ).show( "fast" );
    });
</script>
 <script>
$(function() {
$( "#datepicker" ).datepicker();
$( "#datepicker1" ).datepicker();

}); 
</script>

<div class="productimage">  

                <input data-theme="c" type="search" name="search" id="search-basic" value="" placeholder="Leaving from"/>
                <input data-theme="c" type="search" name="search" id="search-basic" value="" placeholder="Going to"/>
                <p>&nbsp</p>
                <div class="ui-bar ui-bar-b datetime">
                <h3 class="">Date and time </h3>
                </div>
                <div style="width:90%;">
                <br />
                <label>From Date</label>
                <input type="date" name="date" id="datepicker" value=""  />
                <label>To Date</label>
                <input type="date" name="date" id="datepicker" value=""  />

                </div>  
                    <p>&nbsp</p>
                <a href="#" data-transition="fade" data-role="button" data-theme="b"  style="width:70%;margin:auto">Next Step</a>
        </div>

提前致谢。

Answer 1

尝试：

更改input type="text"
在初始化datepicker时指定日期格式
为您的id字段

input

以下是一个例子：

$(function() {
  $("#datepicker-from").datepicker({
    dateFormat: 'yy-MM-dd'
  });
  $("#datepicker-to").datepicker({
    dateFormat: 'yy-MM-dd'
  });
});

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.css">
  <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
  <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<div class="productimage">
  <div class="ui-bar ui-bar-b datetime">
    <h3 class="">Date and time </h3>
  </div>
  <div style="width:90%;">
    <br />
    <label>From Date</label>
    <input type="text" name="date-from" id="datepicker-from" value="" />
    <label>To Date</label>
    <input type="text" name="date-to" id="datepicker-to" value="" />
  </div>
</div>

jquery mobile datepicker无法正常工作o单击文本框

1 个答案: