PROGRAMMING
javascript
- 自作カレンダーをES6で使えるようになったクラスで置き替えてみる
- JS-Image-Resizerを使って画像を高画質で縮小
- ファイルを作成しローカルに保存
- 前月・翌月の日付を埋め込んだカレンダーを作る
- モーダルウィンドウをクラス化
- ストップウォッチを作る
- XMLHttpRequest Lebel2を試してみる
- ページャーを作る(簡易版)
- jQuery:Tableで親・子・兄弟要素を取得
- ページャーを作る
- 文字列をセパレータ文字で分割し配列で返す関数
- forループのカウンタを使用している関数の定義
- クロージャの使いどころ
- JSONPでクロスドメイン
- AjaxでJSON形式のデータを扱う
- jsファイルからjsファイルを呼び出す
- 祝休日対応のカレンダーを作る
- jQuery:モーダルウィンドウを作ってみる
CSS
- フォルダ構成をCSSで見やすくする
- シンタックスハイライトPrismのカスタマイズ
- リスト(li)を中央に配置する
- ブロックレベル要素全体をリンクにする
- 実践と点線の交わり部分のギザギザをすっきりさせる
PHP
Java
- IntelliJ と Gradle で JavaFX アプリケーション(非モジュール版)を作る
- javaのコンパイルと実行
- イメージを回転する
- Exif情報を簡単に取得できるライブラリ
- 高画質で画像縮小
- JDBCによるデータベース操作
SQL
ファイルを作成しローカルに保存
申告に必要なデータをサーバーから取り出しcsvにする必要がありました。
javaだと契約しているサーバーにアクセスできないのでjavascriptで出来ないか調べたらいい方法があったので忘れないようにメモしておきます。
ファイルは<a>タグのダウンロードを利用しますのでダウンロードフォルダに保存されます。
ダウンロード用のHTML
ダウンロード用のアンカータグを配置します。
<a href="#" id="shinkoku">確定申告用csvダウンロード</a>
アンカータグのhref属性とダウンロード属性はjavascript側で指定しました。
ファイルを作ってそのファイルをダウンロードフォルダに保存
プロトタイプで関数MkenCalendarに各月の日数を追加します。2月の閏月の日数の変更は別のメソッドで行います。
年月日が見やすいように、年月日の区切り文字もセットしておきました。
$.getJSON("csv.php", {"year":year}, function(jsonStr){
var csvStr = "";
$.each(jsonStr, function(i, obj){
csvStr += obj.data + "," +
obj.money + "," +
obj.memo + "," +
obj.shop + "\n";
});
// ダウンロード処理
var blob = new Blob([csvStr], {type: "text/plain"});
if(window.navigator.msSaveOrOpenBlob){ // IE
window.navigator.msSaveOrOpenBlob(blob, "shinkoku.csv");
}else{ // IE以外
var obj = document.getElementById("shinkoku");
var blob_url = window.URL.createObjectURL(blob);
obj.href = blob_url;
obj.download = "shinkoku.csv";
}
});
・ 11行目:プレーンテキストのcsvStrをコンテンツとしたBlobオブジェクトを作る。
・ 16行目:createObjectURLで指定ファイルの内容全体がエンコードされ、URLテキストになる。
・ 17行目:アンカータグのリンク先にURLテキストを指定する。
・ 18行目:アンカータグのダウンロード属性に保存するファイル名を指定する。
13行目のmsSaveOrOpenBlob()は16行目から18行目までを一発でできる。(IE)
【Blobコンストラクタのオプションいろいろ】
var blob = new Blob([file], {type: "image/png"});
var blob = new Blob([binary], {type: "application/octet-binary"});
var blob = new Blob(["文字列"], {type: "text/plain"});
var blob = new Blob(["<html>"], {type: "text/plain;charset=UTF-8"});
これは便利に使えます。
- 参考にさせていただいたサイト
- http://www.shurey.com/js/craft/stopwatch/index.html