-
ID:DB0A3t さんの質問

【 質問 jquery datepicker 日数計算 】

datepickerから日数計算をしたいのですが、まったく反応してくれません。
jqueryの書き方はいつもふわっと書いているので、初心者です。。
恐れ入りますが、教えてください。
------------------------------------------------------------------------------------
参考にしたのは下記のURL
http://oshiete.goo.ne.jp/qa/7656838.html
------------------------------------------------------------------------------------
pickerは下記のURL(rangeを使ってます)
http://kwski.net/jquery/1041/
------------------------------------------------------------------------------------

------------------------------------------------------------------------------------

$(’クラス名’).datepicker({

// ここにオプションかいてます

onSelect: function() {

  // 開始を取得
    var from = $(’#date-from’).val();

  // 終了を取得
    var to = $(’#date-to’).val();
    if ( from !== ’’ && to !== ’’ ) {
       var date = new Date(to).getTime() - new Date(from).getTime();
       alert( date/(1000*60*60*24) );
    }
  }
});
------------------------------------------------------------------------------------
良ければ、ご教示お願い致します。。

みんなの回答 3 件

ID:DB0A3t さんの回答

忘れてました。
html部分はこれです!
<input type="text" class="" id="date-from" name="start" required="required" placeholder="2014/11/18" />
<span class="input-group-addon">-</span>
<input type="text" class="" id="date-to" name="end" required="required" placeholder="2014/11/18" />

ID:Cks3fp さんの回答

そのプラグインはonSelectなんてイベントはサポートしてないようだが。マニュアルをよく読め。

bootstrap-datepicker — bootstrap-datepicker documentation

http://bootstrap-datepicker.readthedocs.org/en/release/
ID:DB0A3t

なるほど!そういうことだったんですね。
有難うございます。
---------------------------------------------
$(’クラス名’).datepicker({});の
外に出して、
別で、動かしたらいいんですかね。。
何度もすみませんが、調べてもいまいちわからない、、ため、
ご教示お願い致します!!!

ID:jPj5ae

コメ主が言ってるじゃん。
RTFM

ID:DB0A3t

すみません!!

なので、bootstrap-datepicker上ではなくて、

下記のような
//write-remember.com/program/javascript/date_diff/

inputに入っている日付からjqueryで計算すればいいんですよね。

考え方間違っていますでしょうか。

ID:DB0A3t さんの回答

jQuery(function($) {
jQuery(document).on(’blur’, ’#start, #end’, function(){
var date1 = document.getElementById("start").value;
var date2 = document.getElementById("end").value;
var diff = getDiff(date1, date2);
jQuery("#days").val(diff);
});
});

/*
*日付の差分日数を返却します。
*/
function getDiff(date1Str, date2Str) {
var date1 = new Date(date1Str);
var date2 = new Date(date2Str);

// getTimeメソッドで経過ミリ秒を取得し、2つの日付の差を求める
var msDiff = date2.getTime() - date1.getTime();

// 求めた差分(ミリ秒)を日付へ変換します(経過ミリ秒÷(1000ミリ秒×60秒×60分×24時間)。端数切り捨て)
var daysDiff = Math.floor(msDiff / (1000 * 60 * 60 *24));

// 差分へ1日分加算して返却します
return ++daysDiff;
}
---------------------------------------------------------
うーん。
反映はされるようになりましたが、計算が上手くいってないようです。。

ID:DB0A3t

できました!datepickerのautocloseをfalseするとfocusを自分で外すことになって、計算が上手くいきました!
ご返信してくださった方有難うございました!

ID:Cks3fp

jQuery 使ってるのに getElementById 使ってるのがヘン。プラグインとかよりもっと jQuery 勉強した方がいい。

ID:DB0A3t

はっ!そうなんですか?jqueryの書き方じゃないってことでしょうか。。

ID:DB0A3t

これってことですかね。。
//kaicoo.blogspot.jp/2012/03/jquerygetelementbyid.html

ID:DB0A3t

getElementById("start")

$(’start’)[0];

でしょうか。

ID:DB0A3t

//blog.enjoitech.com/article/171
これれなのかな。

連投すみません。。とても勉強になります。

ID:WZqOza

document.getElementById("start").value;

$("#start").val();
こういうことじゃないの?
jsとjQueryの書き方がごっちゃになってるから、ちょっと下の
jQuery("#days").val(diff);
これと同じ書き方をすればいい。
あとjQueryは省略して書いたほうがいいよ。
//www.jquerystudy.info/tutorial/01/06.html

ID:DB0A3t

わー!有難うございます!勉強します!
皆さん有難うございます。

最終更新日:2014-11-20 (7,321 views)

関連するトピックス

ページ上部に戻る