1

First time asking a question here.

I have two simple Javascript functions that 1. Generates a random letter, and 2. Populates a 10x10 table with a single letter in each cell. The main function that creates the table is called through a simple HTML button with an onclick and it looks like this:

function BGen()
{
    var board = "<table border='0' width='300' cellpadding='3'>";
    for (h = 1; h <= 10; h++) {
        board = board + "<tr>";
        for (v = 1; v <= 10; v++) {
            board = board + "<td>" + RLGen() + "</td>";
        }
        board = board + "</tr>";
    }
    board = board + "</table>";
    document.write(board);
}

For some reason, when the button is clicked, the table is generated as it should be, but the browser is left sitting on "Connecting..." afterward, as if it's waiting for something else.

Can anybody possibly shed some light on this? I haven't a clue why it's doing so.

Thanks in advance.

2
  • Provide more context. Create an example in JSFiddle.net and include more code.
    – JSuar
    Dec 13, 2012 at 0:29
  • On a not important side note: board = board + "..." equals to board += "..." and makes it slightly easier to read. still thinking about the issue though
    – Mathias
    Dec 13, 2012 at 0:33

2 Answers 2

1

You should not use document.write after the page load. That is bad practice.

You should be using either innerHTML or appendChild to add the new elements.

1
  • Hey, thanks. The document.write to .innerHTML solved the issue, actually.
    – user1899442
    Dec 13, 2012 at 0:42
0

Try

event.stopPropagation(); after document.write

not sure how you're calling the function.

And welcome to StackOverflow

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.