0
HTML5と基本的なJavaScriptを使用して簡単なアプリケーションを構築しようとしています。私はそれが働いているが、私は簡単なことをやっている（少なくとも私が使用した他の言語では単純です）。ここに私の現在のコードは次のとおりです。ユーザーは0から200までの数値を入力した場合、私の<output>はこのoutputは、上記のjavascriptから計算し、正しい答えを持っています表示するためにHTMLフォームにエラーメッセージを表示し、ユーザーがエラーを修正した後にこのメッセージを削除します。
<!DOCTYPE html>
<html>
<head>
<title>JS Test</title>
<meta charset="utf-8" />
</head>
<script>
function isTrackValid(track_a, track_b) {
if(track_a > 200.0 || track_a < 0.0) {
return "Number must be between 0 BPM and 200 BPM";
}
if(track_b > 200.0 || track_b < 0.0) {
return "Number must be between 0 BPM and 200 BPM";
}
return "";
}
function calculate(track_a, track_b) {
if(track_a > track_b) {
return ((track_a - track_b)/track_a) * 100;
} else if(track_a < track_b) {
return ((track_a - track_b)/track_b) * 100;
} else {
return 0.0;
}
}
function main() {
track_a = input_a.valueAsNumber;
track_b = input_b.valueAsNumber;
var message = isTrackValid(track_a, track_b);
if(message !== "") {
$('#error_message').text(message);
} else {
var result = calculate(track_a, track_b);
return result.toFixed(2);
}
}
</script>
<body>
<header>
<h1>JS Test</h1>
</header>
<form onsubmit="return false" oninput="o.value=eval(main());">
Track A: <input name="input_a" id="input_a" type="number" min="0.0" max="200.0" placeholder="Track A"><br/>
Track B: <input name="input_b" id="input_b" type="number" min="0.0" max="200.0" placeholder="Track B"><br/>
<br />
<div id="error_message"></div>
Output: <output name="o" step="0.01" for="a b"></output>
</form>
</body>
</html>
私が持って欲しいです。ユーザーが負数または200を超える数値を入力した場合は、エラーを<output>フィールドに入力します。
エラーが発生した場合、現在のコード（およびStackOverflowでの回答の結果として<div>）を使用すると、Outputを上回ります。しかし、ユーザーが有効な番号を入力すると、このエラーはそこに残り、決して消えません。
エラーを解消できるかどうか疑問に思っていましたか？それとも無効な場合はOutputに行かせることができるのですか？
フィドルを追加してください –
@GopsABには、エラーを表示しないように思われます。 net/jthjzsjx/ – Alex
_ $（ '＃error_message'）にjqueryをインクルードしましたか？ – C2486