web-dev-qa-db-ja.com

JQuery Datepicker変更イベントトリガーと入力のデフォルト変更イベント

日付ピッカーがあります

  <input type='text' class='inp'>  
<script>
   $('.inp').datepicker();

  $(".inp").on("change",function (){ 
   console.log('inp changed');
  });
</script>

最初に '.inp'を変更し、そこに値を手動で入力したら、すぐにdatepickerの開いているカレンダーをクリックします。 2つの「変更」イベントリスナーを取得します。最初に手動変更から、次に日付ピッカーの変更から。どうすればこれを回避できますか？

javascriptjquerydatepickerjquery-ui-datepicker
12
Konstantin Vahrushev

入力readOnlyを設定すると、アイコンのみでフィールドの値を変更できます。

<input type='text' class='inp' readOnly />

次のように、onSelectを使用して選択した日付を取得します。

$(function() {
    $(".inp").datepicker({
        onSelect: function(dateText, inst) {
            // alert(dateText);
        }
    });
});
12
Parkash Kumar

次のようなonSelect関数を使用してみてください。

$(function() {
    $( ".datepicker" ).datepicker({
        onSelect: function() {
        //your code here
    }});

これは、入力しているときではなく、カレンダーから日付を選択したときに発生します。

6
brso05

OnSelectを使用して、テキストフィールドで変更イベントをトリガーできます。この方法では、テキストボックスまたは日付ピッカーを使用して日付を編集しても同じように動作します。

$('.inp').datepicker({
  onSelect: function() {
    return $(this).trigger('change');
  }
);

$(".inp").on("change",function (){ 
   console.log('inp changed');
}
3
Shawn Balestracci

bootstrap datepickerを使用している場合、以下を実行できます。

$('.datepicker').datepicker()
    .on('changeDate', function(e){
        # `e` here contains the extra attributes
});

詳細ビューの場合： Bootstrap Datepicker events

0
Mivaweb

皆さんありがとう、これは私が使ったものですが、

function myfunction(x,x2){
    var date1 = new Date(x);
    var MyDateString; 
    MyDateString = date1.getFullYear()+ '/' + ('0' + (date1.getMonth()+1)).slice(-2) + '/' + ('0' + date1.getDate()).slice(-2);
    x2.value=  MyDateString;    
 }

x、datepicker値、x2はdatepickerオブジェクト

0
athene

これを試して

  $(function() {
        $("#birth_date").datepicker({
        onSelect: function() {
            console.log("You Code Here");
        }});
    });
0
Rahul Koshti

ありがとう！みなさん、しかし、私はフィールドを読み取り専用にすることはできませんでした。これは要件です。だから私は自分自身を研究しなければなりませんでした。そこで、最終的な解決策を投稿します。 150ミリ秒のバインドを解除してから、再度バインドしました。 これのためにjqueryプラグインを作成しました

function myfunc(that){
        $(that).one('change', function(){
                var that = this;
                setTimeout(function(){myfunc(that);}, 150);
                //some logic
            }
        )
}

myfunc(".inp");
0
Konstantin Vahrushev