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

Question

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>

What's the pushButton function?

Ted Hopp
– Ted Hopp

2013-02-15 04:43:15 +00:00
Commented Feb 15, 2013 at 4:43 — Ted Hopp
– Ted Hopp, Commented Feb 15, 2013 at 4:43

Benny · Accepted Answer · 2013-02-15 04:41:47Z

3

Move

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

into your function.

answered Feb 15, 2013 at 4:41

Benny

1,4651 gold badge15 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Explosion Pills · Accepted Answer · 2013-02-15 04:44:23Z

2

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

answered Feb 15, 2013 at 4:44

Explosion Pills

192k56 gold badges341 silver badges417 bronze badges

Comments

vijaykumar · Accepted Answer · 2013-02-15 04:52:54Z

0

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

answered Feb 15, 2013 at 4:52

vijaykumar

4,8367 gold badges40 silver badges56 bronze badges

Collectives™ on Stack Overflow

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

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related