0

Bootstrap に Datepicker を使用すると、正常に動作している月に表示モードを制限したいのですが、月を選択したときにドロップダウンを非表示にしたいと考えています。

<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/datepicker.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>


$(function(){
    $('#dp3').datepicker()
});

HTML

<div class="col-xs-6">
    <div class="input-append date input-group" id="dp3"  data-date="102/2012" data-date-format="mm/yyyy" data-date-viewmode="years" data-date-minviewmode="months">
    <input class="span2 form-control" size="16" type="text" value="02/2012">
    <span class="add-on input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
    </div>
    </div>

ここにhttp://jsfiddle.net/ded3v/6/があります

4

2 に答える 2

2

クリックイベントをキャプチャできます:

document.addEventListener("click", function(e){
    if($(e.target).is('.month')) $(e.target).closest('.datepicker.dropdown-menu').hide();
}, true);

デモキャプチャー

プラグインは .month 要素でクリックの伝播を停止します。クリック イベントを委任することはできません。次のコード (dblclick イベントを委任する) を使用して、dblclick で datepicker を閉じることができます (UI エクスペリエンスを向上させるために、この方法を使用することをお勧めします!) :

$(document).on('dblclick','.month',function(){
    $(this).closest('.datepicker.dropdown-menu').hide();
});

デモ dblclick

于 2013-12-07T14:43:58.003 に答える