jQuery Datepickerテキストボックスに今日の日付を事前に入力するにはどうすればよいですか？

私は非常にシンプルなjQuery Datepickerカレンダーを持っています。

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
});

そしてもちろんHTMLで...

<input type="text" size="10" value="" id="date_pretty"/>

今日の日付はユーザーがカレンダーを表示するときにうまく強調表示されますが、ユーザーが何もせずにjQueryでテキストボックス自体にページの読み込み時に今日の日付を事前入力するにはどうすればよいですか？99％の確率で、今日の日付のデフォルトが彼らの望むものになります。

更新：これがChromeで機能しないという報告があります。

これは簡潔であり、仕事をします（時代遅れ）：

$(".date-pick").datepicker('setDate', new Date());

これはそれほど簡潔ではありません。チェーンを利用すると、Chromeで機能するようになります（2019-06-04）：

$(".date-pick").datepicker().datepicker('setDate', new Date());

最初にdatepicker（）を呼び出し、次に「setDate」を使用して現在の日付を取得する必要があります。

$(".date-pick").datepicker();
$(".date-pick").datepicker("setDate", new Date());

または、この回答のコメントに記載されているように、日付ピッカーの初期化後にsetDateメソッド呼び出しをチェーンします

$('.date-pick').datepicker({ /* optional option parameters... */ })
               .datepicker("setDate", new Date());

それだけでは動作しません

$(".date-pick").datepicker("setDate", new Date());

注：許容されるsetDateパラメータはここに記載されています

var myDate = new Date();
var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' +
        myDate.getFullYear();
$("#date_pretty").val(prettyDate);

機能しているように見えましたが、もっと良い方法があるかもしれません。

このsetDate()メソッドは日付を設定し、関連するコントロールを更新します。方法は次のとおりです。

$("#datepicker1").datepicker({
    dateFormat: "yy-mm-dd"
}).datepicker("setDate", "0");

デモ

ドキュメントで述べたようにsetDate()、JavaScriptのDateオブジェクト、数値、または文字列を受け入れます。

新しい日付は、Dateオブジェクトまたは現在の日付形式の文字列（例：'01 / 26/2009 '）、今日からの日数（例：+7）、または値と期間の文字列（' y 'for年、月は「m」、週は「w」、日は「d」、たとえば「+ 1m + 7d」）、またはnullを選択して日付をクリアします。

ご参考までdefaultDateに、コンストラクタでプロパティを設定しても、関連付けられているコントロールは更新されません。

今日に設定：

$('#date_pretty').datepicker('setDate', '+0');

昨日に設定：

$('#date_pretty').datepicker('setDate', '-1');

など、今日の日付の前後何日でも同様です。

jQuery UI›メソッド› setDateを参照してください。

解決策は次のとおりです。

$(document).ready(function(){
    $("#date_pretty").datepicker({ 
    });
    var myDate = new Date();
    var month = myDate.getMonth() + 1;
    var prettyDate = month + '/' + myDate.getDate() + '/' + myDate.getFullYear();
    $("#date_pretty").val(prettyDate);
});

グレイゴースト、ありがとう！

これは私のために働いた。

$('#inputName')
  .datepicker()
  .datepicker('setDate', new Date());

このコードは、日付ピッカーのフォーマットを使用することを保証します：

$('#date-selector').datepicker('setDate', new Date());

フォーマットを再適用する必要はありません。日付ピッカーの初期化時にユーザーが事前定義した日付ピッカーを使用します（割り当てた場合！）;）

David K Eggheadのコードは完全に機能しました。ありがとうございます。

$(".date-pick").datepicker(); 
$(".date-pick").datepicker("setDate", new Date()); 

私もそれを少しトリミングしてうまくいきました：

$(".date-pick").datepicker().datepicker("setDate", new Date()); 

$('input[name*="date"]').datepicker({
        dateFormat: 'dd-mm-yy',
        changeMonth: true,
        changeYear: true,
        beforeShow: function(input, instance) { 
            $(input).datepicker('setDate', new Date());
        }
    });

ロード時に日付ピッカーを特定のデフォルト時間（私の場合は現在の日付）に設定し、構文が別の日付を選択できるようにするには、次のようにします。

    $(function() { 
        // initialize the datapicker
        $("#date").datepicker();

        // set the time
        var currentDate = new Date();
        $("#date").datepicker("setDate",currentDate);

    //  set the options for the button  
        $("#date").datepicker("option",{
            dateFormat: 'dd/mm',
            showOn: "button",
          // whatever option Or event you want 
        });
  });

日付を事前入力するには、最初に日付ピッカーを初期化してから、setDateパラメータ値を渡す必要があります。

$("#date_pretty").datepicker().datepicker("setDate", new Date());

ちょうど2セント追加すると思いました。ピッカーは追加/更新フォームで使用されているため、既存のレコードを編集する場合はデータベースからの日付を表示し、そうでない場合は今日の日付を表示する必要がありました。以下は私にとってはうまくいきます：

    $( "#datepicker" ).datepicker();
    <?php if (!empty($oneEVENT['start_ts'])): ?>
       $( "#datepicker" ).datepicker( "setDate", "<?php echo $startDATE; ?>" );
    <? else: ?>
       $("#datepicker").datepicker('setDate', new Date());   
    <?php endif; ?>
  });

2つのオプションがあります。

オプションA） 入力をクリックした場合にのみ、カレンダーで「アクティブ」としてマークします。

Js：

$('input.datepicker').datepicker(
                        {   
                            changeMonth: false,
                            changeYear: false,
                            beforeShow: function(input, instance) { 
                                $(input).datepicker('setDate', new Date());
                            }
                        }                         
                     );

CSS：

div.ui-datepicker table.ui-datepicker-calendar .ui-state-active,
        div.ui-datepicker table.ui-datepicker-calendar .ui-widget-content .ui-state-active  {
            background: #1ABC9C;
            border-radius: 50%;
            color: #fff;
            cursor: pointer;
            display: inline-block;
            width: 24px; height: 24px;
        }​

オプションB）今日のデフォルトで入力します。最初にdatepickerを入力する必要があります。

$（ "input.datepicker"）。datepicker（）。datepicker（ "setDate"、new Date（））;

var prettyDate = $.datepicker.formatDate('dd-M-yy', new Date());
alert(prettyDate);

prettyDateを必要なコントロールに割り当てます。

これを試して

$(this).datepicker("destroy").datepicker({
            changeMonth: false, changeYear: false,defaultDate:new Date(), dateFormat: "dd-mm-yy",  showOn: "focus", yearRange: "-5:+10"
        }).focus();

これ.datepicker('setDate', new Date());は、datepickerが既にパラメーターで構成されている場合、混乱するため呼び出しに問題が発生することがあるので、私にとってはうまくいきます。

$("#myDateText").val(moment(new Date()).format('DD/MM/YYYY'));

これを使って：

$(".datepicker").datepicker({ dateFormat: 'dd-M-yy' }).datepicker('setDate', new Date());

形式で日付を取得するには（例：2019年10月10日）これは、ユーザーにとってよりわかりやすくなります。

$(function()
{
$('.date-pick').datePicker().val(new Date().asString()).trigger('change');
});

ソース：http : //www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html