Friday, December 21, 2012

Recursive Function: Factorial: Part 6: HTML and JavaScript


Example: Doing Factorial in HTML and JavaScript



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Example: Doing Factorial in HTML with JavaScript</title>
<script type="text/javascript">
    function calcFact() {
 
        // do below for lable, p, h2, etc.
        // means, need no .value for rectrieving data
        //        need    .innerHTML for outputting data
        //var x = document.getElementById("lbl01");
        //alert(x.innerHTML);
 
        // do below for textbox
        // means, need    .value for rectrieving data
        //        need no .innerHTML for outputting data     
        //var y =document.getElementById("txb01").value;
        //alert(y);
        //   or do this
        //alert(document.getElementById("txb01").value);
 
        var x = document.getElementById("txb01").value;
        if (x == parseInt(x)) {
            // Number was integer
            document.getElementById("lbl02").innerHTML = fact(x);
        }
        else {
            document.getElementById("lbl02").innerHTML = 'Empty or not integer';
        }
    }
    function fact(i) {
        if (i == 0) {
            return 1;
        }
        else {
            return i * fact(i - 1);
        }
    }
</script>
</head>
 
<body>
    <h2>Example: Doing Factorial in HTML with JavaScript</h2>
    <label id="lbl01">Enter integer here: </label>
    <input id="txb01" type="text" />
    <input id="btn01" type="button" onclick="calcFact()" value="Calculate Factorial" />
    <label id="lbl02">The answer will be posted here</label>
 
</body>
</html>
 

 
Webpage



 

No comments:

Post a Comment