2017-02-12 11 views
0

Я пытаюсь включить datetimepicker в свою модальную форму. Все мои коды работают на другой странице html. Но когда я включаю этот код на свою страницу после нажатия на кнопку мода, открывается черная пустая страница. Проведя часы, я узнал, что когда я исключил файл bootsrap.css, он отлично работает. Но мне нужны стили bootsrap. Я пытаюсь найти и удалить модальные и битовые стили. Но это ничего не меняет. Единственное решение, исключая bootsrap.css.datetimepicker не запускается при включении bootstrap.css

<head> 

<link rel="stylesheet" href="css/grid.css"> 
<link rel="stylesheet" href="css/style.css"> 
<link rel="stylesheet" href="css/touchTouch.css"> 
<link rel="stylesheet" href="css/bootstrap.css"> 
<link rel='stylesheet prefetch' href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css"> 
<link rel='stylesheet prefetch' href="https://s3-us-west-2.amazonaws.com/s.cdpn.io/2708/bootstrap-datetimepicker.min.css"> 

<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css"> 
<script src="js/jquery.js"></script> 
<script src="js/touchTouch.jquery.js"></script> 
<script src="js/jquery-migrate-1.2.1.js"></script> 
<script src="js/script.js"></script> 
<script src="js/packery.pkgd.min.js"></script> 
<script src="js/bootstrap.js"></script> 
<script src="js/bootstrap.min.js"></script> 
<!--[if (gt IE 9)|!(IE)]><!--> 
<script src="js/jquery.mobile.customized.min.js"></script> 
<script src="js/wow.js"></script> 
<script> 
    $(document).ready(function() { 
     if ($('html').hasClass('desktop')) { 
      new WOW().init(); 
     } 
    }); 
    </script> 
<body> 
    <div class="item col-sm-3" > 
         <div class="in"> 
          <div class="img"> 
           <img src="images/arabalar/ekonomi/Dacia-SANDERO.png" width="100%"/> 
          </div> 
          <div class="name"> 
           Dacia-SANDERO 
          </div> 

         <!-- Button to trigger modal --> 
      <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

      <!-- Modal --> 
       <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <h3 id="myModalLabel">Modal header</h3> 
      </div> 
       <div class="modal-body"> 
       <div id="datetimepicker1" class="input-append date"> 
       <input data-format="dd/MM/yyyy hh:mm:ss" type="text">      </input> 
      <span class="add-on"><i data-time-icon="icon-time" data-date-icon="icon-calendar"></i></span> 
      </div> 
    </div> 
     <div class="modal-footer"> 
      <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
     </div> 
</div> 

<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> 
<script src='http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js'></script> 
<script src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/2708/bootstrap-datetimepicker.min.js'></script> 
<script src="js/index1.js"></script> 

и index1.js содержат

$(function() { 
    $('#datetimepicker1').datetimepicker({ 
     language: 'pt-BR' 
    }); 
}); 
+0

Можете ли вы предоставить ссылку на документацию для этой библиотеки «datetimepicker»? – kkaosninja

+0

http://s6.dosya.tc/server8/etedk6/site.rar.html –

ответ

0

Включить только один bootstrap.js файл либо bootstrap.min.js или bootstrap.js файл или

Включите Jquery первый затем добавьте бутстрап в свой раздел.

+0

Thanx для ответа. Я сделал то, что вы говорите. jQuery перед загрузкой. я пропустил что-то еще? –

+0

Опубликовать скрипку с вопросом –

+0

вы можете скачать и проверить здесь? в скрипке я не могу добавить несколько файлов стиля http://s6.dosya.tc/server8/etedk6/site.rar.html –