隐藏在模态窗口后面的JQuery timepicker插件

时间:2016-02-09 20:54:42

标签: javascript php jquery twitter-bootstrap bootstrap-modal

我在互联网和堆栈的其他问题上寻找答案,但没有一个解决方案适合我。我试了几天。我的timepicker JQuery插件出现在触发的模态窗口后面。我没有多少时间在科学博览会之前离开,而且我真的遇到了麻烦。如果有人知道如何帮助我,我真的非常非常感谢。干杯,并提前谢谢。这是代码和图片:

Screenshot of time-picker

表单部分

<div class='form-group'>
    <label for='start' class='col-xs-4 control-label'>Starting time</label>
        <div class='col-xs-5'>
            <?php include('test.php'); ?>
        </div>
</div>

test.php的

<html>
<head>
  <style type="text/css" media="all">@import "timePicker.css";</style>
  <style type="text/css">
  input {
    margin:0;
    padding:0;
  }
  pre {
    background:#fff;
    border:1px solid #ddd;
    padding:4px;
  }
  .ui-timePicker { 
  position: relative; 
  z-index: 10000 !important; 
  }
  </style>
  <meta charset='utf-8'>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
  <script type="text/javascript" src="jquery.timePicker.js"></script>
 </head>
 <body>
            <p><input id="time1" type="text" class="time form-control" /></p>
        <script>
              $("#time1").timePicker();            
        </script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

您是否尝试过更改时间选择器的z索引?

<style>
#time1{
    z-index:1151 !important;
    }
</style>