WEBデザインDTPデザイン個人レッスン

イラストレーターの家庭教師で勉強しよう

DTPデザイナーWEBデザイナーココフラッはデザイン制作や個人レッスンをご提供。自由な時間に東京カフェや会社ご自宅でグラフィックソフト、イラストレーターやフォトショップ、ワードプレスやホームページ制作の勉強、マンツーマンの個人指導でスキルアップ。
初回無料体験レッスン! Skypeレッスンは全国対応

  • Photoshop
  • Illustrator
  • Dreamweaver
  • Wordpress
  • Html+css

人気のコンテンツ

ワードプレステーマをカスタマイズの学校
ウェブ作成の指導は女性出張講師
ウェブ作成教室で勉強するならデザイン教室
初心者入門講座の個人レッスンデザイン教室

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('半角数値を入力して下さい');
	}
}

 
無事整いましたー!
 
 

イベントのreturn false

HTMLタグの中にはフォームやアンカーなど基本動作があらかじめ定義されているものがあります。イベントを使って処理を行う際、この基本動作をキャンセルすることがよくあり
return false で動作をキャンセルします。
 
 
参考サイト:JavaScriptで値が数値かどうかチェックする:isNaN()
https://uxmilk.jp/46961

 

check!

お問い合わせはこちらからどうぞ
レッスンについてはこちらからどうぞ