CODEWITHSUNDEEP
javascripthtmlevent-handling
Greg
Greg

Reputation: 305

HTML/Javascript: How do you change input tag with javascript?

Heres some of what I got, its a calculator, I'mg tryign to call the JS method from the button click events, something wrong though, display won't update. 

<script language="javascript" type="text/javascript" src="calculator.js"> 
        var display = document.getElementById('display');

        function digit( num ){
            if(display == 0){
                display.innerHTML = num;
                } else {
                    display.innerHTML = display.innerHTML + "" + num;
                    }
        };


    </script>
    </head>
    <body>
    <form name="calculator">
      <table width="auto" border="1">
        <tr>
          <!--<td colspan=4><input id="display" type="text"></td> -->
          <td colspan=4><div id="display"></div></td>
        </tr>
        <tr>
          <td>MC</td>
          <td>MR</td>
          <td>MS</td>
          <td><input type="button" value='/' onclick="pushButton(this.value);"></td>
        </tr>
        <tr>
          <td><input type="button" value=7 onclick="javascript:digit(this.value);"></td>
          <td><input type="button" value=8 onclick="javascript.digit(this.value);"></td>
          <td><input  type="button" value=9 onclick="pushButton(this.value);"></td>
          <td><input  type="button" value='*' onclick="pushButton(this.value);"></td>
        </tr>
        <tr>
          <td><input  type="button" value=4 onclick="pushButton(this.value);"></td>
          <td><input  type="button" value=5 onclick="pushButton(this.value);"></td>
          <td><input  type="button" value=6 onclick="pushButton(this.value);"></td>

Upvotes: 0

Views: 164

Answers (3)

vijaykumar
vijaykumar

Reputation: 4806

Place 0 in the div Or change the condition in script (display == null )

Upvotes: 0

Explosion Pills
Explosion Pills

Reputation: 191749

You are calling document.getElementById('display'); before that element (id=display) exists. You can do a variety of things, but the easiest would just be to move the <script> to just before </body>, or at least after id=display

Upvotes: 2

Benny
Benny

Reputation: 1465

Move

var display = document.getElementById('display');

into your function.

Upvotes: 3

Related Questions