Phonegap Android：使用jquery mobile的DateTime Picker不工作？

嗨朋友是新手機應用程序開發（使用jQuery的手機和手機）。在我的項目中，我有一個任務，我需要設置日期時間選擇器。我使用一些代碼設置它，但它不工作。請幫助我如何使用jquery mobile.Am我需要任何插件或js。請幫助我提前致謝。Phonegap Android：使用jquery mobile的DateTime Picker不工作？

<!DOCTYPE html> 
<html> 
<head> 
    <title>Zeus Palace Hotel</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <link rel="stylesheet" href="//code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> 
    <link rel="stylesheet" href="//dev.jtsage.com/cdn/datebox/latest/jquery.mobile.datebox.min.css" /> 
    <link rel="stylesheet" href="css/gi-mobile.css" /> 

    <script type="text/javascript" src="//code.jquery.com/jquery-1.6.4.min.js"></script> 
    <script type="text/javascript" src="//code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
</head> 
<body> 
    <section data-role="page" id="home" data-theme="b"> 
    <header data-role="header" class="header"> 
    <figure class="hotelBanner"></figure> 
    </header> 
    <section data-role="content" class="ui-grid-a main cf"> 
    <form id="step1" action ="#"> 
    <label for="checkinDate">Check-in:</label> 
    <input name="checkinDate" id="checkinDate" type="date" data-role="datebox" 
    data-options='{"mode": "calbox", "afterToday": true}' /> 
    <label for="checkoutDate">Check-out:</label> 
    <input name="checkoutDate" id="checkoutDate" type="date" data-role="datebox" 
    data-options='{"mode": "calbox", "afterToday": true}' /> 
    <input type="submit" id="btnsubmit" value="Next >>" /> 
    </form> 
    <p>Number of Nights: <span id="numNights"></span></p> 
    </section> 
    <footer data-role="footer" class="footer"> 
    </footer> 
    </section> 

    <script type="text/javascript" src="//dev.jtsage.com/cdn/datebox/latest/jquery.mobile.datebox.min.js"></script> 
    <script>window.jQuery.fn.validate || document.write('<script src="js/libs/jquery.mobile.datebox.min.js"><\/script>')</script> 
    <script type="text/javascript" src="//dev.jtsage.com/cdn/datebox/i8n/jquery.mobile.datebox.i8n.en.js"></script> 
    <script>window.jQuery.fn.validate || document.write('<script src="js/libs/jquery.mobile.datebox.i8n.en.js"><\/script>')</script> 

    <script defer src="js/master.js"></script> 

</body> 
</html>

JS文件： //主JS //

jQuery.extend(jQuery.mobile.datebox.prototype.options, { 
    'dateFormat': 'mm/dd/YYYY', 
    'headerFormat': 'mm/dd/YYYY', 
}); 

$(document).ready(function() { 
    $('a.ui-btn .ui-icon').removeClass('ui-icon-grid'); 
    $('a.ui-btn .ui-icon').addClass('ui-icon-arrow-d'); 
function parseDate(elem) { 

    return elem.data('datebox').theDate; 
} 

function daydiff(checkinDate, checkoutDate) { 

    return (checkoutDate-checkinDate)/(1000*60*60*24) 
} 
$('#checkoutDate, #checkinDate').live('change', function() { 
    $('#numNights').each(function() { 
     $(this).text(daydiff(parseDate($('#checkinDate')), parseDate($('#checkoutDate')))); 
    }); 
}); 

});

，但它不是工作..告訴我任何其他的想法使用jQuery Mobile的

來源

2014-01-29 Naresh

做到這一點，我認爲你忘了更新您的訪問策略以允許所有網址，請使用以下代碼更新您的config.xml文件：

<access origin="*" />

來源

2014-01-29 10:07:11

的jQuery插件也是我們需要添加訪問策略啊 – Naresh

這個訪問策略將允許項目中的所有網址，只是爲了確保您的問題不是政策問題 –

沒有辦法，你的應用程序將工作沒有這項政策 –

jQuery手機的簡單datetimepicker。

嘗試此解決方案：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta content="text/html; charset=windows-1255" http-equiv="content-type"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <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="http://code.jquery.com/jquery-1.9.1.js"></script> 

<script> 
$(function() { 
$("#datepicker").datepicker(); 
}); 
</script> 

</head> 
<body> 

    <div id="page" data-role="page" data-theme="c"> 
     <div id="header" data-role="header"> 
      <h1>Play</h1> 
      <p>Date: </p>  
       <label for="date">Select Date Range:</label> 
       <input type="date" name="date" id="datepicker" value="" /> 

</body> 
</html>

來源

2014-01-29 10:08:04 Suhas

它仍然不工作仍然在我的andriod模擬器 – Naresh

它爲我工作。再次檢查。你也可以參考這個 - http://demos.jquerymobile.com/1.0a4.1/experiments/ui-datepicker/ – Suhas

請參閱可用的插件 - http://www.jquery4u.com/plugins/10-jquery-time- picker-plugins/ – Suhas

Phonegap Android：使用jquery mobile的DateTime Picker不工作？

回答

相關問題