How can I call this function, im trying to get the 4th form field to add up the first 3 fields - on the fly fl?

<html>
<head>
<script language="javascript" type="text/javascript">
function addition(){
var t = document.getElementById("roll_1").value * 1;
t += document.getElementById("roll_2").value * 1;
t += document.getElementById("roll_3").value * 1;
document.getElementById("roll_total").va… = t;
return false; // or true after testing
}
</script>
</head>
<body>
<form>
<input value=" " type="text" name=" " id="roll_1" />
<input value=" " type="text" name=" " id="roll_2" />
<input value=" " type="text" name=" " id="roll_3" />
<input value=" " type="text" name=" " id="roll_total" />
</form>
</body>
</html>

Answers :

Just use:

onKeyUp="javascript:addition();" inside the input tags for the three roll text boxes and the function will update the fourth box each time one of the boxes is changed.

I've done a demo of it here (click the html tab to see the modified input tags):

http://jsdo.it/DaveP/5fHj

Make the addition function return the variable "t" instead of true or false. Then put this in the same script tag outside the function.

UPDATE: Make "roll_total" a button instead (type="button") and do this:

    window.onload = function() {
        document.getElementById( 'roll_total' ).onclick = function() {
            this.value = addition();
        };
    };