使用Javascript生成表單時不會提交

Question

我正在javascript中生成一個登錄表單。 表單顯示完美，HTML開發工具中的HTML看起來很好，但單擊提交按鈕時表單將不會提交。

Heres是生成的表單代碼：

var loginBox = '<div id="loginBox">';
loginBox    += '<h1>Login</h1>';
loginBox    += 'Please use the form to login below<br /><br />';
loginBox    += '<form action="home.php" method="post">';
loginBox    += '<div class="input">';
loginBox    += '<label for="username">Username</label>';
loginBox    += '<input type="text" name="username" />';
loginBox    += '</div>';
loginBox    += '<div class="input">';
loginBox    += '<label for="userpass">Password</label>';
loginBox    += '<input type="password" name="password" />';
loginBox    += '</div>';
loginBox    += '<div class="clear"></div>';
loginBox    += '<div class="input">';
loginBox    += '<input type="submit" class="submit button" value="Submit" />';
loginBox    += '</div>';
loginBox    += '</form>';
loginBox    += '</div>';

為什么這不起作用的任何想法？ 我知道我可能會在按下提交按鈕時寫一些Javascript來提交表單，但我不明白為什么這是必要的。 謝謝

Answer 1

更大的問題是為什么要使用Javascript創建登錄框？

我認為重構它並使表單存在於隱藏的div中更清晰，並使用JavaScript根據需要顯示/隱藏它。 通過使用element.innerHTML動態添加表單，這將解決一些瀏覽器的問題。

如果這不是一個選項，那么您可能必須更改您的JS以使用DOM添加它。 這非常冗長，不易閱讀。

Answer 2

我把它添加到這個頁面，它似乎工作。 您是否有可能攔截表單提交事件的客戶端驗證腳本？

我的代碼：

$(loginBox).appendTo("body");