0
J'ai récemment commencé le script java et ai fini HTML et CSS. Mon problème est que pour une raison quelconque ma forme qui est censée convertir des centimètres en pouces n'affiche pas la sortie dans la deuxième forme .... bien que ma première forme fonctionne qui convertit Celsius en Fahrenheit. La deuxième chose étrange est que la première forme ne fonctionne que lorsque tout le code pertinent au second formulaire est supprimé. Je suis nouveau à javascript et apprécierais toute aideJ'ai un problème avec mon formulaire de conversion qui convertit les pouces en centimètre
Ceci est mon script HTML et Java.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="First Website.css" />
<title>
</title>
</head>
<body>
<h1 class="title">Conversion Table
<h1>
<!--The div styling the box for the conversion table -->
<div class="convert">
<!--The title to the conversion of fahrenheit to celsius -->
<h1>Convert Fahrenheit to celsius </h1>
<!--The input form for Celsius -->
<p>
<input id="c" onkeyup="convert('C')">:Celsius</p>
<!--The input form for Fahrenheit -->
<p>
<input id="f" onkeyup="convert('F')">:Fahrenheit</p>
</div>
<div class="convert1">
<h1>Convert Centimetres to inches</h1>
<p>
<input id="m" onkeyup="convert1('M')">:Centimetres</p>
<p>
<input id="i" onkeyup="convert1('I')">:inches</p>
</div>
</body>
<script>
// the function to convert fahrenheit to celsius and vice versa
function convert(degree) {
var x;
if (degree == "C") {
x = document.getElementById("c").value * 9/5 + 32;
document.getElementById("f").value = Math.round(x);
} else {
x = (document.getElementById("f").value - 32) * 5/9;
document.getElementById("c").value = Math.round(x);
}
}
//the function to convert centimetres to inches
function convert1(distance) {
var y;
if (distance == "M") {
y = document.getElementById("m").value/0.393701;
document.getElementById("i").value = Math.round(y);
}
else {
y = (document.getElementById("m").value * 1.393701;
document.getElementById("i").value = Math.round(y)
}
}
</script>
<style>
.convert {
border: 2px solid black;
width: 450px;
top: 100px;
position: static;
background-color: #CD6A44;
float: left;
color: black;
font-size: 20px;
display: inline-block;
}
.title {
position: fixed;
/* or absolute */
left: 45%;
font-size: 40px;
}
body {
background-color: #262626
}
h1 {
font-ize: 25px;
}
.convert1 {
border: 2px solid black;
width: 450px;
top: 100px;
position: static;
background-color: #CD6A44;
float: right;
color: black;
font-size: 20px;
display: inline-block;
}
</style>
</html>