datetimepicker-master：：でぃーたたいむぴっかーマスター！！日本語化
2017.10.14
datetimepicker-masterが日本語化できない。時刻だけ表示したい、カレンダーだけ表示したいなどに
実は対応しているのだけど、バージョンがアップしてからそのやり方が変わっていて
ググってもそのやり方が出てこないので、じぶんが記載してみました。
ソースを読まないと見えてこないものが有るですが、ぶっちゃけ他人のソースを読むのは面倒くさいでもプラグインは使用したい方。
下記のコードで日本語化可能です。
カレンダー非表示可能です。
時刻非表示可能です。
ちなみにソースを見るとdefault_options（でふぇるとおぷしょん）のオブジェクトで
その他、操作も可能ですのでソースを読みたい人は読んでみてください。
ちなみにちなみにdatetimepicker-masterプラグインはこちらからダウンロード可能です。
https://github.com/xdan/datetimepicker
サンプルプログラムはこちらです。
https://zip358.com/tool/datetimepicker
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>zip358.com:datetimepicker日本語</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=10.0, user-scalable=yes">
<link rel="stylesheet" href="./datetimepicker-master/jquery.datetimepicker.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="./datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
<script>
$(function(){
$.datetimepicker.setLocale("ja");//にほんご
$("#dtp").datetimepicker({
format:"Y/m/d H:i",
formatTime:"H"//時間だけ(分：非表示)
});
$("#dtp2").datetimepicker({
format:"Y/m/d",
timepicker:false//時刻非表示
});
$("#dtp3").datetimepicker({
format:"H:i",
datepicker:false//カレンダー非表示
});
});
</script>
</head>
<body>
<input id="dtp" type="text">
<input id="dtp2" type="text">
<input id="dtp3" type="text">
<div id="ana">
</div>
</body>
</html>
タグ
com, datetimepicker, datetimepicker-master, default, github, https, options, xdan, アップ, オブジェクト, カー, カレンダー, コード, こち, こちら, サンプル, じぶん, ソース, その他, タイム, ダウンロード, バージョン, ふぇると, プラグイン, プログラム, マスター, もの, やり方, 下記, 人, 他人, 使用, 可能, 対応, 操作, 方, 日本語化, 時刻, 表示, 記載,
JSプラグインを作ってみた、今回はANA旅割JSプラグイン（またかよ）。
2017.09.30
JSプラグインを作ってみた、今回はANA旅割JSプラグイン・・・。
またかよと言われそうなのですが、試しに作ってみたりした。
本当はもっと簡略化できるのだけど、あえてこれを参考に作る人にも
ある程度、参考になるかなというぐらいの代物です。
昨日、datetimepickerというプラグインを仕事で見ていて最初、取り出し方などが
わからず試行錯誤してなんとか取り出すことが出来たのですが、これでは駄目だな。
前、なんか書いていたけど使わなかったらやはり忘れてしまうので
本日から一週間ぐらい、しょぼいJSプラグインを何個かリリースします。
大量のコードは仕事終わってから書くことは出来ないかもしれないけれど
サンプルプログラム程度は簡単にコードが書けるように
しておかないと行けないなという気持ちもあります。
そしてjQueryから自前のjQueryプラグインへ
仕事でもシフトしていくつもりです。
やはりコチラのほうが慣れれば楽かなと感じます。
トイウコトでANA旅割JSプラグインは
こちらからダウンロードを行なってください。
ちなみに作りかけなので、これから再編集してもらっても
構いません。なんせ適当ですから：）
https://zip358.com/tool/ana_js_p/
(function($){
var ana_tabai = {
ana75:function(d){
var dd = [];
dd[0] = d[0];
dd[1] = d[1];
dd[2] = d[2];
var dt = new Date(d[0],d[1],d[2]);
dt.setFullYear(dt.getFullYear());
dt.setMonth(dt.getMonth());
dt.setDate(dt.getDate()-74);
dd = mumu(dt.getFullYear(),dt.getMonth(),dt.getDate(),dd);
return [dd[0] + "年",dd[1] + "月",dd[2] + "日"];
},
ana55:function(d){
var dd = [];
dd[0] = d[0];
dd[1] = d[1];
dd[2] = d[2];
var dt = new Date(d[0],d[1],d[2]);
dt.setFullYear(dt.getFullYear());
dt.setMonth(dt.getMonth());
dt.setDate(dt.getDate()-54);
dd = mumu(dt.getFullYear(),dt.getMonth(),dt.getDate(),dd);
return [dd[0] + "年",dd[1] + "月",dd[2] + "日"];
},
ana45:function(d){
var dd = [];
dd[0] = d[0];
dd[1] = d[1];
dd[2] = d[2];
var dt = new Date(d[0],d[1],d[2]);
dt.setFullYear(dt.getFullYear());
dt.setMonth(dt.getMonth());
dt.setDate(dt.getDate()-44);
dd = mumu(dt.getFullYear(),dt.getMonth(),dt.getDate(),dd);
return [dd[0] + "年",dd[1] + "月",dd[2] + "日"];
},
ana28:function(d){
var dd = [];
dd[0] = d[0];
dd[1] = d[1];
dd[2] = d[2];
var dt = new Date(d[0],d[1],d[2]);
dt.setFullYear(dt.getFullYear());
dt.setDate(dt.getDate()-27);
dt.setMonth(dt.getMonth());
dd = mumu(dt.getFullYear(),dt.getMonth(),dt.getDate(),dd);
return [dd[0] + "年",dd[1] + "月",dd[2] + "日"];
},
ana21:function(d){
var dd = [];
dd[0] = d[0];
dd[1] = d[1];
dd[2] = d[2];
var dt = new Date(d[0],d[1],d[2]);
dt.setFullYear(dt.getFullYear());
dt.setDate(dt.getDate()-20);
dt.setMonth(dt.getMonth());
dd = mumu(dt.getFullYear(),dt.getMonth(),dt.getDate(),dd);
return [dd[0] + "年",dd[1] + "月",dd[2] + "日"];
}
};
$.fn.tabiwari = {
ana:function(d){
if(d.split("-").length==3){
var a = d.split("-");
console.log(a);
s = [ana_tabai.ana75(a),ana_tabai.ana55(a),ana_tabai.ana45(a),ana_tabai.ana28(a),ana_tabai.ana21(a)];
var str="";
var days = [75,55,45,28,21];
for(var i = 0;i < s.length;i++){
str += days[i] + "days ::" + s[i] + "<br>";
}
return str;
}else{
return "no!! :( ";
}
}
}
})(jQuery);
function mumu (y,m,dy,dd){
console.log(dd);
dd[0] = !m?dd[0]:y;
dd[1] = !m?dd[1]:m;
dd[2] = !m?dy:dy;
return dd;
}
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>zip358.com:ANAJSぷらぐいん</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=10.0, user-scalable=yes">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="ana_tabiwari.js"></script>
<script>
$(function(){
$("#ana_input").change(function(){
var str = $("#ana_input").tabiwari.ana($(this).val());
$("#ana").html(str);
});
});
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-71682075-1', 'auto');
ga('send', 'pageview');
</script>
</head>
<body>
<input id="ana_input" type="date">
<div id="ana">
</div>
<a href="ana_tabiwari.js" download="ana_tabiwari.js">ANA旅割JSプラグインダウンロード</a>
</body>
</html>
タグ
AM, ANA旅割JSプラグイン, B06XNQCW7B, console.log, d.split, datetimepicker, dt.getDate, dt.setDate, fn.tabiwari, function, jquery, new Date, return dt, return str, s.length, var ana_tabai, var days, var dt, var str, トイウコト,