Eyecatch jQuery

Javascript,jQuery

jQueryで台湾ドル to 日本円コンバータを作ってみた。

2015/11/04

前回のポストネタであるJSONP取得を使い、台湾ドルの為替レートAPIを利用して日本円では幾らになるかのコンバーターを作成したので晒してみます。

台湾ドル→日本円コンバータ

APIで為替レートを取得

APIはこちらのものを利用させて頂きました。
クジラ 外国為替 確認 API (為替 RSS)

画面はこんな感じ。
アクセスした時にAPIを実行し、レートを取得し、表示。
金額を入力し、Convert ボタンで日本円に換算するという、単純なものです。

jquery.tgConvTwd2JpYen

JavaScript部分

まずはスクリプトを全部載っけてみます。

HTML部分

つぎにHTML部分。

JSONP取得部分

前回ポストの復習にもなりますが、JSONPデータの取得部分。
$ajax() 関数を利用して 指定URL へアクセスし、必要な値を変数へ代入しています。

計算部分

「Convert」ボタン押下時の処理。
入力金額金額と取得したレートを掛けて結果を取得しているだけです。

3桁カンマを入れる

結果を見やすくするために、結果に対し、3桁カンマを入れています。
PHPの number_format() の様な関数は無いために、独自で関数を作成する必要がありました。
すげー面倒。

デモ

「台湾ドル→日本円コンバータ」デモはこちらから!

-Javascript,jQuery
-, , , , , , , ,