質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

解決済

javascriptが実行されない

nonnon8.
nonnon8.

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

3回答

-2評価

0クリップ

29閲覧

投稿2018/04/18 12:08

ドットインストールの動画を見ながら割り勘電卓というアプリを作成中です。
html、CSSは問題無いのですがjavascriptが機能しません。

どこがおかしいかチェックしてもらえませんか。
よろしくお願いいたします。

html

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>**</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="input-area"> <input type="text" id="price" placeholder="金額"> <input type="text" id="num" placeholder="人数"> <select id="unit"> <option value="10">10円単位</option> <option value="100" selected>100円単位</option> <option value="1000">1000円単位</option> </select> <div id="btn">計算</div> </div> <div class="result-area"> <p id="result">ここに結果を表示します</p> <div id="reset">もう一度計算する?</div> </div> <script src="main.js"></script> </body> </html>

CSS

body{ background: #ccc; font-size:16px; font-family: Arial,sans-serif; } .container{ width:600px; margin:25px auto; } #price,#num,#unit{ font-size:14px; box-sizing: border-box; padding:10px; height:40px; border-radius: 5px; border:none; margin-right: 10px; } #price{ width:140px; } #num.#unit{ width:110px; } #btn{ cursor:pointer; display:inline-block; box-sizing: border-box; width:110px; height:40px; padding:10px; background: #3897fd; border-radius: 5px; font-size: 14px; text-align: center; color:#fff; } .input-area{ font-size: 0px; margin-bottom: 20px; } .result-area{ background: #f8f8f8; padding:10px; height:130px; border-radius: 5px; position: relative; } #result{ margin:0px; } #reset{ text-decoration:underline; cursor: pointer; position: absolute; bottom: 10px; right: 10px; }

javascript

var price=document.getElementbyId('price'); var num=document.getElementbyId('num'); var unit=document.getElementbyId('unit'); var btn=document.getElementbyId('btn'); var result=document.getElementbyId('result'); var reset=document.getElementbyId('reset'); btn.addEventLintener('click',function(){ var payless; var payMore; var short; var over; var str; payless=Math.floor(price.value/num.value/unit.value)*100; short=price.value-(payless*num.value); payMore=Math.ceil(price.value/num.value/unit.value)*100; over=Math.abs(price.value-(payMore*num.value)); if(over===0&&short===0){ str='一人'+(price.value/num.value)+'ちょうどです'; }else{ str= '一人'+payless+'円だと'+short+'円足りません'+ '一人'+payMore+'円だと'+over+'円多いです'; } result.textContent=str; });

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。