プロが教えるわが家の防犯対策術!

https://oshiete.goo.ne.jp/qa/9548285.html

このソースを動かすと、立替(ttk)を無入力でも問題なく動くのですが、合計がNaNになるので、無入力のときは自動的に0を入れて(初期値が0でも出来るのかな?)テキストボックス内にも0を最初から表示させておく。
というようにしたいです。
どうすればいいでしょうか。

質問者からの補足コメント

  • テキストボックス内にあらかじめ表示させておくというのは、gooの検索窓のように薄く表示させて入力の邪魔にならないようにする感じです。
    無入力だと表示されたままで、何かを入力した瞬間に消えるやつですね。
    valueだとそのまま値として0が入ってしまうので消す手間がかかります。

      補足日時:2017/11/12 09:39

A 回答 (1件)

こんにちは


回答が無いようなので・・・


>無入力だと表示されたままで、何かを入力した瞬間に消えるやつですね。
いわゆるプレースホルダという機能です。
placeholder属性を利用することで、実現可能です。
http://myakura.github.io/n/placeholder.html

とはいっても、これは未入力時に「入力のガイド」として利用される文字列ですので、未入力の際のデフォルト値としての働きはありません。
(仮にプレースホルダで「0」を表示させておいても、値は未入力のままになります)
デフォルトの値などを設定なさりたい場合は、スクリプト側で処理する必要があります。
(未入力ならデフォルト値(0など)を採用すれば良いだけなので…)

>合計がNaNになるので、無入力のときは自動的に0を入れて
なぜNaN表示になるか、理解なさっているでしょうか?
NaNはNot-A-Numberの意味です。
https://developer.mozilla.org/ja/docs/Web/JavaSc …

通常、input要素などの値(value値)を取得した際、その内容は文字列として返されます。
javascriptでは文字列⇔数値の変換をスクリプトエンジンが適宜行ってくれているので、一見便利ではあるのですが、変換不可能なものが存在するとNaNなどのエラーになります。
ですので、未入力の場合だけでなく、"五百"などと数値を文字で入力した場合でも同様のエラーになるでしょう。

このような場合への対処として、HTML5では、input要素にtype="number"を指定することで、数値入力に限定することができるようになりました。
https://developer.mozilla.org/ja/docs/Web/HTML/E …
これを利用することで、他の文字列の入力を避けることはできますが、未入力だけは残ってしまいます。
それなので、結局は、スクリプト側でのチェック(またはデフォルト値の設定)は避けられないところです。

具体的には、
 v = lement.value; は(内容が数値であっても)文字列として返しますので、きちんと処理するのなら
 v = parseInt(Element.value, 10); などとして明示的に数値化しておくほうが良いです。(この例では整数化です)
この際に、数値化できない値(未入力など)に対してはNaNが返されますので、
 if(isNaN(pareseInt(Element.value))) などで判断して、デフォルト値(0など)を設定すればよいでしょう。

簡略化して記述するなら、or演算を利用して
 v = parseInt(Element.value, 10) || 0; でも同様の結果を得ることができます。
更に、簡略化するなら
 v = Element.value | 0; でも、ほぼ同様の結果となります。
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!