JavaScriptで自動計算プログラム 数値ではないisNaN()
新しいサービス、5回パック料金のシステムを始めようかと準備中です。
通常の5回料金より5%割引サービスですが、お客様により1回当たりのレッスン料が違うので、自動計算するプログラムを組んでみます。
WordPressサイトの固定ページに組み込むので、エディター内で編集するのを前提としました。
↓出来上がり「サービスパック」ページ
https://cocofrappe.com/special/
プログラミングでは半角英数以外のひらがなの全角数字を入力すると計算が出来ません。
半角英数を入力してもらうのと、それを整数化 parseInt() する必要があります。
条件分岐 if で数値である条件はどう表すんだろう、と調べてみました。
関数 isNaN() → 数値でない true で返す
ということなので
ではない ! と組み合わせて
!isNaN() → 数値である
で行けそうです
function buttonclick() {
var pri = parseInt(document.getElementById('myt').value);
if ( !isNaN(pri) ) {
allPrice = pri * 5 - pri * 5 * 0.05;
alert('あなたのサービスパック料金(税・交通費込み)は ' + allPrice + '円 です。');
bet = " サービズパック料金は「" + allPrice + "円」";
document.getElementById('msg').innerHTML= bet;
} else {
alert('半角数値を入力して下さい');
}
}
無事整いましたー!
HTMLタグの中にはフォームやアンカーなど基本動作があらかじめ定義されているものがあります。イベントを使って処理を行う際、この基本動作をキャンセルすることがよくあり
return false で動作をキャンセルします。
参考サイト:JavaScriptで値が数値かどうかチェックする:isNaN()
https://uxmilk.jp/46961
人気記事
ココフラッペ公式LINE
LINEで簡単お問い合わせやレッスン予約が出来ます。
お役立ち情報も配信中!