I'm learning web development and I am struggling with JavaScript.
I have a web page that will give frequency details from an entered frequency, but I cannot work out how to make the if-statement work.
Below is the HTML and below that is the JavaScript.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Radio Frequency Assistant</title>
</head>
<body>
<nav class="navbar">
<h1>Radio Frequency Assistant</h1>
<p>Helping to tune you in!</p>
</nav>
<div class="main">
<div class="top">
<div class="innerTop"><p></p></div>
<div class="innerTop">
<label>Enter a Value</label>
<input name="freq" id="freq" type="text" size="10" placeholder="example 3.0254">
</div>
<div class="innerTop">
<label>Choose Frequency</label>
<form class="hertz">
<select id="hertz">
<option value="Hz">Hz</option>
<option value="kHz">kHz</option>
<option value="MHz">MHz</option>
<option value="GHz">GHz</option>
<option value="THz">THz</option>
</select>
</form>
</div>
<div class="innerTop">
<button onclick="freqDetails()">Frequency Details</button>
</div>
</div><!-- top -->
<div class="middle"></div><!-- middle -->
<div class="bottom">
<div class="innerBottom">
<h3>Frequency Range</h3>
<p>Top and Bottom Value</p>
<p> Selected: <span id="enteredValue"> </span></p>
<p> Range: <span id="freqRange"> </span></p>
</div>
<div class="innerBottom">
<h3>Wavelength Range</h3>
<p>Length of the Wave</p>
<span id="waveRange"> </span>
</div>
<div class="innerBottom">
<h3>Frequency</h3>
<p>Band Information</p>
<span id="bandRange"> </span>
</div>
<div class="innerBottom">
<h3>Propagation</h3>
<p>Type Used</p>
<span id="prop"> </span>
</div>
</div><!-- bottom -->
</div>
</body>
</html>
My Javascript:
function freqDetails()
{
document.getElementById('enteredValue').innerHTML =
document.getElementById("freq").value +
document.getElementById("hertz").value;
var freq = enteredValue;
if(freq <= '30kHz'){
document.getElementById('freqRange').innerHTML = '3-30kHz';
document.getElementById('waveRange').innerHTML = '100-1km';
document.getElementById('bandRange').innerHTML = 'VLF';
document.getElementById('prop').innerHTML = 'Ground Wave';
}
}
All assistance is appreciated.
Aucun commentaire:
Enregistrer un commentaire