我的問題是,我希望顏色根據值來切換,奇數、偶數或只是0。我在 stackoverflow 上搜索了一些答案,但沒有一個真正有幫助..所以,如果答案很奇怪,顏色應該是藍色。如果答案是偶數,則顏色應為紅色。如果答案為 0,則顏色應為黃色。
有什么線索可以幫助我繼續前進嗎?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
body {
background-color: #0D1112;
}
form {
display: flex;
height: 30px;
gap: 30px;
align-items: center;
justify-content: center;
}
p {
color: white;
}
h1 {
color: white;
text-align: center;
}
#svar {
background-color: #0D1112;
}
h4 {
color: white;
}
</style>
</head>
<body>
<form id="f0rm">
<input name="nummer1" id="nummer1" type="text" size="5">
<select id="dropDown" name="thing" id="dropID">
<option>choose</option>
<option value=" "> </option>
<option value="-">-</option>
<option value="x">x</option>
<option value="/">/</option>
</select>
<input name="nummer2" id="nummer2" type="text" size="5"> =
<input type="button" id="calculator" value="Submit">
</form>
<div id="svar">
<p>Your answer is...</p>
<h4>Blue = odd answer</h4>
<h4>Red = even answer</h4>
<h4>Yellow = your answer is just 0</h4>
</div>
<script>
$(function() {
$('#calculator').click(function() {
var value = $("#dropDown").val();
var number1 = $("#nummer1").val();
var number2 = $("#nummer2").val();
var int1 = parseInt(number1);
var int2 = parseInt(number2);
if (value === " ") $("#svar p").text(int1 int2);
else if (value === "-") $("#svar p").text(int1 - int2);
else if (value === "/") $("#svar p").text(int1 / int2);
else if (value === "x") $("#svar p").text(int1 * int2);
if (value % 2 == 0)
$("#svar p").css("background-color", "red")
else(value % 2 == 1)
$("#svar p").css("background-color", "blue")
});
});
</script>
</body>
</html>
uj5u.com熱心網友回復:
只是除錯了你的代碼一點點
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
body {
background-color: #0D1112;
}
form {
display: flex;
height: 30px;
gap: 30px;
align-items: center;
justify-content: center;
}
p {
color: white;
}
h1 {
color: white;
text-align: center;
}
#svar {
background-color: #0D1112;
}
h4 {
color: white;
}
</style>
</head>
<body>
<form id="f0rm">
<input name="nummer1" id="nummer1" type="text" size="5">
<select id="dropDown" name="thing" id="dropID" required>
<option>choose</option>
<option value=" "> </option>
<option value="-">-</option>
<option value="x">x</option>
<option value="/">/</option>
</select>
<input name="nummer2" id="nummer2" type="text" size="5"> =
<input type="button" id="calculator" value="Submit">
</form>
<div id="svar">
<p>Your answer is...</p>
<h4>Blue = odd answer</h4>
<h4>Red = even answer</h4>
<h4>Yellow = your answer is just 0</h4>
</div>
<script>
$(function() {
$('#calculator').click(function() {
var value = $("#dropDown").val();
var number1 = $("#nummer1").val();
var number2 = $("#nummer2").val();
var int1 = parseInt(number1);
var int2 = parseInt(number2);
let result = 0;
if (value === " ") result = int1 int2;
else if (value === "-") result = int1 - int2;
else if (value === "/") result = int1 / int2;
else if (value === "x") result = int1 * int2;
$("#svar p").text(result)
if (result % 2 == 0){
$("#svar p").css("background-color", "red");
} else {
$("#svar p").css("background-color", "blue");
}
});
});
</script>
</body>
</html>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/371105.html
標籤:javascript 查询
