function updateScript() {
var wilson = document.getElementById("wilson");
var willow = document.getElementById("willow");
var mighty = document.getElementById("mighty");
}
window.addEventListener("click", function(event) {
updateScript();
console.log(wilson + willow + mighty);
});<input style="text" name="wilson" id="wilson" maxlength="1" size="1">
<input style="text" name="willow" id="willow" maxlength="1" size="1">
<input style="text" name="mighty" id="mighty" maxlength="1" size="1">The console.log doesn't add my values, but here is the object:
It outputs [object HTMLInputElement][object HTMLInputElement][object HTMLInputElement]
How can this be fixed to add the values? (the input has javascript to prevent letters, only allows numbers)
You need to use .value, this is the correct code for your updateScript():
updateScript();
console.log(wilson.value +willow.value + mighty.value);
});
You can learn more about the property: http://www.w3schools.com/jsref/prop_option_value.asp
UPDATE:
After looking at code, you have a problem with your HTML validation, you had <head> tags inside <body>, that is a problem and will make your whole code not function right. You can use HTML validators to check if your code is validating, it needs to be valid before it can even work!
You can put your <script> inside the <head> tag or in <body> tag.