Javascript 用户使用表单在表中输入

我有这个问题，我已经研究了几天了。我需要制作一个页面，请求用户提交12封信，然后单击submit按钮。我不能使我想出的东西发挥作用。欢迎提出建议！运行的Javascript应该执行以下操作：为行数生成一个随机数1-3，并将12个字符放入格式化的表中。例如，随机生成的表可能会产生以下结果：

输入的文本：abcdefghijkl

 a b c
 d e f
 g h i 
 j k l

或：

等等

我的HTML：

<form name="table">
<p>Enter 12 letters</p>
<input type="text" id= "userVal" size="12">
<input type="button" value="submit"  onclick="createTable()">

输入12个字母

Javascript:

var numrows= randomnumber=Math.floor(Math.random()*4)
var numcols=4
document.write ("<table border='1'>")

for (var i=1; i<=numrows; i++)
{
    document.write ("<tr>");
    for (var j=1; j<=numcols; j++)
    {
            document.write ("<td>" + i*j + "</td>");
    }

    document.write ("</tr>");
}


document.write ("</table>");

function createTable(){

var numrows=randomnumber=Math.floor（Math.random（）*4）
var numcols=4
document.write（“”）
对于（var i=1；i查看这是否是您正在寻找的行为：


我将循环修改为基于零，并引用了文本框：

var createTable = function () {
   var numrows = Math.floor(Math.random()*3) + 1; // x3 gets 0, 1, or 2 so increment 1
   var numcols = 12 / numrows; // if always printing 12 chars
   var userText = $('#userVal').val();
   var output = "<table border='1'>";

   for (var i=0; i < numrows; i++)
   {
       output += "<tr>";
       for (var j=0; j<numcols; j++)
       {
           output += '<td>' + userText[i*numcols + j] + '</td>';
       }

       output += "</tr>";
   }

   output += "</table>";
   $('#output').html(output);
};

var createTable=函数（）{
var numrows=Math.floor（Math.random（）*3）+1；//x3得到0、1或2，所以增量为1
var numcols=12/numrows；//如果始终打印12个字符
var userText=$（'#userVal'）.val（）；
var输出=”；
对于（变量i=0；i对于（var j=0；jj页面加载后，您不能使用
document.write
——当然，也不能不破坏当前页面。查看此页面了解如何使用表：这更符合我需要的行为。但是，由于某些原因，Numrows会产生超过3行。此外，对于javascript，一些syn，我确实是新手我不熟悉的税，比如“$”符号和“#”的用法。我还没有进入jquery，只是尝试使用JavaScriptah，这更为熟悉。我如何设置它以允许用户输入他们想要的内容并将他们输入的字符放入表中。此外，在这段代码中，没有“onclick”如何调用函数？JSFIDLE需要我在代码最后一行设置的onclick。我只想将它添加到您已经拥有的onclick中，例如，
Test按钮
var createTable = function () {
   var numrows = Math.floor(Math.random()*3) + 1; // x3 gets 0, 1, or 2 so increment 1
   var numcols = 12 / numrows; // if always printing 12 chars
   var userText = $('#userVal').val();
   var output = "<table border='1'>";

   for (var i=0; i < numrows; i++)
   {
       output += "<tr>";
       for (var j=0; j<numcols; j++)
       {
           output += '<td>' + userText[i*numcols + j] + '</td>';
       }

       output += "</tr>";
   }

   output += "</table>";
   $('#output').html(output);
};