@Blog
日常日誌からプログラムやYOUTUBER紹介、旅日記まで日々更新中です。
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>
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
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>
著者名
@taoka_toshiaki
※この記事は著者が30代前半に書いたものです．
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
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, トイウコト,