Question

我有下拉菜单，我可以选择一个动作。在我选择行动并将我的数字放入其中后，我需要在底部显示答案。我为每个动作创建了函数，但我不知道如何使其工作。此外，它应该表明，如果第二个数字等于0，我就不能分开。

＆＃13;

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<link type="text/css" rel="stylesheet" href="stilius.css">
	</head>

	<body>
		<form>
			<div id="pavadinimas">
				Operacija
			</div>
	
			<label>
				<select>
					<option>Sudėtis</option>
					<option>Atimtis</option>
					<option>Daugyba</option>
					<option>Dalyba</option>
				</select>
			</label>

			<label>
				<div class="text">1 skaičius</div>
				<input id="pirmasSkaicius" type=number placeholder="Pirmas skaičius"></input>
			</label>

			<label>
				<div class="text"> 2 skaičius</div>
				<input id="antrasSkaicius" type=number placeholder="Antras skaičius"></input>
			</label>

				<b>Rezultatas:</b> 
				<span id="rezultatas"></span>
		</form>
	</body>
	
	<script>
		function sudetis(){
			1sk = document.getElementById("pirmasSkaicius").value;
			2sk = document.getElementById("antrasSkaicius").value;
			document.getElementById("rezultatas").innerHTML = 1sk + 2sk;
		}
		
		function atimtis(){
			1sk = document.getElementById("pirmasSkaicius").value;
			2sk = document.getElementById("antrasSkaicius").value;
			document.getElementById("rezultatas").innerHTML = 1sk - 2sk;
		}
		
		function daugyba(){
			1sk = document.getElementById("pirmasSkaicius").value;
			2sk = document.getElementById("antrasSkaicius").value;
			document.getElementById("rezultatas").innerHTML = 1sk * 2sk;
		}
		
		function dalyba(){
			1sk = document.getElementById("pirmasSkaicius").value;
			2sk = document.getElementById("antrasSkaicius").value;
			document.getElementById("rezultatas").innerHTML = 1sk / 2sk;
		}
	</script>
</html>

＆＃13;

Answer 1

以下是该代码段的工作版本。首先，js变量不能以数字开头，因此我将1sk更改为sk1，将2sk更改为相同。我添加了一个按钮，需要单击该按钮才能显示结果。此外，我已将所有功能融合在一起。如果有任何不清楚的地方，你可以看看并告诉我。

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<link type="text/css" rel="stylesheet" href="stilius.css">
	</head>

	<body>
		<form>
			<div id="pavadinimas">
				Operacija
			</div>
	
			<label>
				<select id="operacija">
					<option value="sudetis">Sudėtis</option>
					<option value="atimtis">Atimtis</option>
					<option value="daugyba">Daugyba</option>
					<option value="dalyba">Dalyba</option>
				</select>
			</label>

			<label>
				<div class="text">1 skaičius</div>
				<input id="pirmasSkaicius" type="number" placeholder="Pirmas skaičius"></input>
			</label>

			<label>
				<div class="text">2 skaičius</div>
				<input id="antrasSkaicius" type="number" placeholder="Antras skaičius"></input>
			</label>
			<button id="calculate">calculate</button>
				<b>Rezultatas:</b> 
				<span id="rezultatas"></span>
		</form>
	</body>
	
	<script>
	
		document.getElementById("calculate").addEventListener("click", function(event){
			event.preventDefault();
			calculate();
		});
		
		function calculate(){
			var sk1 = parseFloat(document.getElementById("pirmasSkaicius").value);
			var sk2 = parseFloat(document.getElementById("antrasSkaicius").value);
			var operacija = document.getElementById("operacija").value;
			switch (operacija) {
				case 'sudetis':
					result = sk1 + sk2;
					break;
				case 'atimtis':
					result = sk1 - sk2;
					break;
				case 'daugyba':
					result = sk1 * sk2;
					break;
				case 'dalyba':
					if(sk2 != 0)
						result = sk1 / sk2;
					else
						result = "You cannot divide by zero";
					break;

			}
			document.getElementById("rezultatas").innerHTML = result;


		}
	
	</script>
</html>

从选项

1 个答案: