Javascript Times Table HELP! ! ! !

**PrincessT187** · 02-29-2012 05:01 AM

I need to create a times table using javascript. The user needs to input a number in a text field and when the button his hit it generates a times table into an HTML table. In column 1 it should display the number that was entered into the text field, column 2 should display the loop 1 to 10, and column 3 should display the answer.

I know I need to use onclick, .innerHTML, and getElementById() but I am unsure how to get the results into the table. Please help! ! ! ! !

Thanks

**nap0leon** · 02-29-2012 09:05 AM

Presuming you already have your math worked out...
as you cycle through each "times" (x1, x2, x3, ...), you set the innerHTML of each table cell to the value.

e.g.
if "i" is the counter in your loop and "num" is what you are multiplying by, and each cell in your table has an id such as "ans1", "ans2", etc.:

Code:

ans = num * i
document.getElementById('ans' + i).innerHTML = ans

**JMRKER** · 02-29-2012 10:44 AM

Alternative attempt ...

Code:

<!DOC HTML>
<html>
<head>
<title> Multiplication Table </title>
<script type="text/javascript">
//<![CDATA[
function multiplier() {
  var mult = document.getElementById('multipleOf').value;
  var str = '';
  str += '<table border="1" width="100%">';
  str += '<caption> Multiples of: '+mult+'</caption>';
  str += '<tr>';
  for (var i=0; i<10; i++) {
    str += '<td style="text-align:right">';
    str += ' X ' + i + ' = <br>';
    str += mult * i;
    str += '</td>';
  }
  str += '</tr>'
  str += '</table>';
  document.getElementById('multTable').innerHTML = '<h2>Multiplication Table</h2>'+str;
}
//]]>
</script>

</head>
<body>
<input type="text" id="multipleOf" value="">
<button onclick="multiplier()">Multiplier Table</button>
<div id="multTable"> <h2>Multiplication Table</h2> </div>
</body>
</html>

Thread: Javascript Times Table HELP! ! ! !

Thread Tools

Display

Javascript Times Table HELP! ! ! !

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions