莫代尔引导日历上的Java日历

Question

嗨，我使用的是模态引导程序和日历里面，但是当我点击日历按钮日历出现在后面，它必须在模态。这是图片。

这是Java代码：

<script type="text/javascript"> 
//<![CDATA[ 
    window.addEvent('domready', function() { 
     myCal1 = new Calendar({ fcap1: 'd/m/Y' }, { blocked: ['12-15,20-22,25 2-5 2008'], direction: 0, tweak: { x: 6, y: 0 } }); 
     myCal2 = new Calendar({ fcap2: 'd/m/Y' }, { blocked: ['12-15,20-22,25 2-5 2008'], direction: 0, tweak: { x: 6, y: 0 } }); 

       }); 
    //]]> 
</script> 

，这是模态引导

<div class="container"> 

     <div class="modal fade" id="modal-fechacap" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-dialog"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal">&times;</button> 
         <h4 class="modal-title">Asignar fechas de captura</h4> 
        </div> 
        <div class="modal-body"> 


         <input type="hidden" name="horario" id="horario" value=""/> 
          <p> 
          <label>Materia:</label> 
         <input type="text" name="materia" id="materia" value="" size='50' maxlength='80' readonly/> 
          </p> 
          <p> 
         <label>Unidad:</label> 
         <input type="text" name="unidad" id="unidad" value="" size='5' maxlength='2' readonly/> 

          </p> 
          <p> 
           <label>fecha inicio:</label> 
           <input type="text" name="fcap1" id="fcap1"/> 
           <label>fecha fin:</label> 
           <input type="text" name="fcap2" id="fcap2"/> 

          </p> 
        </div> 

        <div class="modal-footer"> 
          <div style="margin-left:10px"> 
          <button type="button" class="fechacap btn btn-success btn-sm" id="fechacap"> 
          <i class="glyphicon glyphicon-pencil"></i> Asignar fechas de captura 
          </button> 
          <a href="" class="btn btn-danger btn-sm" data-dismiss="modal"> 
          <i class="glyphicon glyphicon-ban-circle"></i>&nbsp;Cancelar&nbsp;</a> 
          </div> 
        </div> 
       </div> 
      </div> 
     </div> 
</div> 

所有建议都欢迎和赞赏，感谢。

我更新了calendar.js中的这段代码，效果很好！

'styles': { left: '-1000px', opacity: 0, position: 'absolute', top: '-1000px', zIndex: 999999 } 

Answer 1

您可以尝试写一些CSS目标日历并设置它的z-index比，模态的大。查看z-index与网页检查器的模式是什么，并使日历的大小为z-index。例如：

#calendar { 
    z-index: 1000; 
}