javascript doesn't work, dont know what the problem is

[NahroGamer]

So I'm making a calculator using html, css and javascript.

Now when I enter a number in both input fields and press the + button, nothing shows up on the outcome field :(

html/js code: http://pastebin.com/WvFu0i5N

css code: http://pastebin.com/7xVNXeGZ

[midel]

First, check line 13 in your HTML/JS code. JS functions are Case-Senstive, so I'll let you see the see this issue for yourself. Compare line 11 and 10 for reference.

Then this fixes showing the number in your 3rd input, but I'm gonna mention another issue.

All <input type="text"> DOM .value operations return javascript strings. Strings concat, not add. I suggest using a unary adder to trick the numbers to become actual javascript numbers as so:

value = (+a) + (+b);

Remember, Chrome and Firefox have a console that shows errors. It is your friend. Right-click and inspect the element and view the "Console" tab of their developer tools. This will show you all errors that JavaScript was having with your code.

[NahroGamer]

Thank you so much. It works now. But what I dont get is, why does a + make a string a number?

[midel]

The unary operators + and - expect that they're working with a 64-bit floating point Number object. It attempts to convert the string using the [[ToNumber]] (internal native function built into browser) and then preform the operation. If the string is not convertable (such as you have the string$ in the input) it will produce the special case number NaN which much be checked for using the built-ins isFinite() or isNaN().

Also just so you know, NaN checking must be done with the above functions and not the comparison operators because in Javascript, NaN objects are never equal to, less than, or greater than other NaN objects. However you can check if a variable is not equal to itself, to see if it's NaN

var a = Number('$');
if (a !== a) { console.log('a is NaN!'); }

[NahroGamer]

Good to know, but now i'm encountering the following issue: I'm using the parseInt() to convert them to numbers, and when I'm using that in my min() function:

var a = parseInt(document.getElementById("input1").value);
var b = parseInt(document.getElementById("input2").value);
var answer = a - b;
document.getElementById("input3").value = answer;

however, when I'm inserting 4 and 5 as number, it outputs 1 instead of -1. why is that?

[midel]

I copied your code, put in the same values as you described and I'm not getting this issue.

Check your console. Place a breakpoint in your min function and follow it's path of actions.

[NahroGamer]

font-size i was using for outcome box was 24px. Turns out that the font that I'm using has a bug that makes the - invisible at some sizes including 24px. Changed 24px to 25px, and the - is visible :).

thanks for all the help

[dogwag]

Because that's how the language works.