2014-02-05 2 views
0

Привет, друзья, я новичок в разработке мобильных приложений, разрабатываю приложение для Android-андроида. whrer я использовал jquery mobile для css и проектирования. используя вышеуказанные URL-адреса.jQuery мобильный конфликт: jquery mobile css и jquery mobile datepicker конфликт?

<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css"/> 
    <script src="js/jquery-1.9.1.min.js"></script> 
    <script src="js/jquery.mobile-1.3.2.min.js"></script> 
And now the problem is when i tried to set as datetime picker in my project using jquery mobile. using above urls 
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
    <link type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" rel="stylesheet" />  
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>   
    <script type="text/javascript" src="http://dev.jtsage.com/jquery.mousewheel.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.datebox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.flipbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.durationbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.slidebox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/i18n/jquery.mobile.datebox.i18n.en_US.utf8.js"></script> 

</head> 
<body> 
<h1>Welcome to Andriod PhoneGap</h1> 
<div data-role="page" id="index"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       First Page 
      </h3> 
      <a href="#second" class="ui-btn-right">Next</a> 
     </div> 

     <div data-role="content"> 
      <label for="mydate">Some Date</label> 
      <input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true}'/> 
     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
<p>J-Technologies &copy; 2013 All Rights Reseverd | Design by <a href="http://www.jtechindia.com" target="_blank">J-Technologies</a></p> 
</body> 
</html> 

Когда я добавить этот код весь JQuery мобильный CSS получает противоречил, но мне нужно, чтобы установить даты и время выбора установлен в моем проекте, но его получить противоречил и DateTime Picker не работает. он работает, когда я удаляю свой jQuery mobile css, но мне нужны оба. помогите мне, как решить этот конфликт вот мой полный источник

<!DOCTYPE HTML> 
<html> 
<head> 
<title>PhoneGap</title> 
<script type="text/javascript" charset="utf-8" src="cordova-2.7.0.js"></script> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script> 
<meta name="keywords" content="Delicious Iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" /> 
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" /> 
<link href="css/slider.css" rel="stylesheet" type="text/css" media="all" /> 
<script src="js/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script> 
<script type="text/javascript" src="js/camera.min.js"></script> 
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css"/> 
<script src="js/jquery-1.9.1.min.js"></script> 
<script src="js/jquery.mobile-1.3.2.min.js"></script> 
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
    <link type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" rel="stylesheet" />  
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>   
    <script type="text/javascript" src="http://dev.jtsage.com/jquery.mousewheel.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.datebox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.flipbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.durationbox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.slidebox.min.js"></script> 
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/i18n/jquery.mobile.datebox.i18n.en_US.utf8.js"></script> 

</head> 
<body> 
<h1>Welcome to Andriod PhoneGap</h1> 
<div data-role="page" id="index"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       First Page 
      </h3> 
      <a href="#second" class="ui-btn-right">Next</a> 
     </div> 

     <div data-role="content"> 
      <label for="mydate">Some Date</label> 
      <input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true}'/> 
     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
<p>J-Technologies &copy; 2013 All Rights Reseverd | Design by <a href="http://www.jtechindia.com" target="_blank">J-Technologies</a></p> 
</body> 
</html> 
+0

Сохранять только режим даты js и удалять все остальные режимы js, во-вторых, ур ссылается на jqm css дважды –

+0

Вам нужен только один файл js среди всех, чтобы установить режим окна даты –

ответ

0

Вы использовали 2 CSS файлы

<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css"/> 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 

Использование 1.3.2 мин CSS, как вы имеете в виду 1.3.2 jqm JS

Смежные вопросы