More typically there would be several possible inputs on the page. We need some more HTML tags to create a "form" , grouping input devices such as text fields, buttons and drop-down lists to make a dialogue box within the page. Here is an example of a form representing a crude calculator:
<form id="calc">
<input id="a" type="text" maxlength="8" style="width:70px">
<select id="op">
<option id="plus" selected> + plus</option>
<option id="minus"> - minus</option>
<option id="times"> x times</option>
<option id="divide"> / over</option>
</select><br>
<input id="b" type="text" maxlength="8" style="width:70px">
<input type="button" onclick="calculate()" style="width:70px" value=" = ">
<p id="calcresult">________</p>
<!-- The underscores make space on the page -->
</form>
Displayed it looks like this:
The new features here are:
The main things that will be new in the JavaScript to work with this form will be: