web-dev-qa-db-ja.com

moment.jsとsetIntervalを使用した動的な日付と時刻

moment.js を使用して動的な日付と時刻を表示する方法を見つけようとしています。

どうやら私はsetIntervalを正しく使用することを理解できません。

可能であれば、moment.jsはjQueryを必要としないため、jQueryを使用したくないと思います。

これが私がこれまでに持っているものです： http://jsfiddle.net/37fLF/2/ 。

$(document).ready(function () {
    var datetime = $('#datetime'),
        date = moment(new Date()),
        update = function(){
            datetime.html(date.format('dddd, MMMM Do YYYY, h:mm:ss a'));
        };
    update();
    setInterval(update, 1000);
});​
javascriptjquerysetintervalmomentjs
14
bchr

コードにいくつか変更を加えました。

メソッドの更新がreadyイベントハンドラーの外部にあることに注意してください

コード：

var datetime = null,
        date = null;

var update = function () {
    date = moment(new Date())
    datetime.html(date.format('dddd, MMMM Do YYYY, h:mm:ss a'));
};

$(document).ready(function(){
    datetime = $('#datetime')
    update();
    setInterval(update, 1000);
});

作業デモ： jsfiddle

23
MilkyWayJoe

繰り返しになりますが、ご回答ありがとうございます。私が最終的に得たコードは次のとおりです。 （デンマーク語i18nに注意）

moment.lang('da');

var datetime = null, date = null;

var datetime_update = function() {
  date = moment(new Date());
  datetime.html(date.format('[Lige nu: ] dddd [d.] Do MMMM YYYY [kl.] HH:mm:ss'));
};

$(document).ready(function() {
  datetime = $('#datetime');
  datetime_update();
  setInterval(datetime_update, 1000);
});

[〜＃〜] edit [〜＃〜]：この質問をした9か月後、jQueryを使用せずにこの方法を見つけました（最初に尋ねたとおり）。ここにあります：

function date_time() {
  now = moment().format('dddd [d.] Do MMMM YYYY [kl.] HH:mm:ss');
  document.getElementById('timer').innerHTML = now;
  setTimeout(function () { date_time(); }, 1000);
}
date_time();

そしてもちろん、次のようなHTMLIDで使用します。

<span id="timer"></span>
3
bchr

プット

date = moment(new Date());

更新関数内。今、あなたは毎秒同じ日付を印刷しているだけです;）

2
Halcyon

これは私がどのように行っているかであり、その動作はここで確認できます

HTML

<asp：Label ID = "Label1" runat = "server" Text = ''>

JavaScript
< script language="javascript" type="text/javascript">
function date_time() 
{
var dt = new Date();
document.getElementById('<%=Label1.ClientID%>').innerHTML = dt;
setTimeout(function () { date_time(); }, 1000);
}
date_time();
< /script>
0
Muhammad Hamayoon