There is a need for the user to be able to change the value, and as a result, the numbers should automatically update. I am facing this issue where the values are not changing correctly. Additionally, I was wondering if it is feasible to link a JS file in an HTML document to run within a JavaFX webView?
var numbersToChange;
var multiplier;
function pageLoad() {
var inputBox = Number(document.getElementById("servingInputBox").value);
multiplier = new Array();
numbersToChange = document.getElementsByClassName("numberToChange");
for (i = 0; i < numbersToChange.length; i++) {
multiplier[i] = Number(numbersToChange[i].innerHTML) / inputBox;
}
}
function changeNumbers() {
var inputboxValue = Number(document.getElementById("servingInputBox").value);
for (i = 0; i < numbersToChange.length; i++) {
numbersToChange[i].innerHTML = (Math.trunc((inputboxValue * multiplier[i]) * 10)) / 10;
}
}
function increase() {
var inputBox = Number(document.getElementById("servingInputBox").value);
document.getElementById("servingInputBox").value = (Math.trunc(inputBox * 10) + 10) / 10;
changeNumbers();
}
function decrease() {
var inputBox = Number(document.getElementById("servingInputBox").value);
var newNumber = (Math.trunc(inputBox * 10) - 10) / 10;
if (newNumber >= 0) {
document.getElementById("servingInputBox").value = newNumber;
changeNumbers();
}
}
function enter(e) {
if (e.keyCode == 13) {
var inputBox = Number(document.getElementById("servingInputBox").value);
document.getElementById("servingInputBox").value = Math.trunc(inputBox * 10) / 10;
changeNumbers();
}
}@font-face {
...
<html>
...
</html>If anyone has any insights or solutions regarding this matter, please do share your knowledge.