Question

我有一个javascript函数的问题，它设置div的.innerHTML。应该出现在div中的HTML代码是一个表单。在我自己测试表单之前（没有javascript）并且它有效。它将信息发送到页面请求。

但是当我使用.innerHTML使表单出现在div中时，表单的布局工作正常，但按钮没有提交表单。它没有做任何事情。

希望你能帮助我。我刚刚开始在脑子里得到一些javascript： - ）

function reactieID(a,b,c,d){
document.getElementById('myModal').innerHTML= ('<form name="getTheInfo" method="post" action="actionpage.php">');   
document.getElementById('myModal').innerHTML+=('<div class="subtitel">Reactie</div>');
document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="a" type="text" value="'+a+'" />');
document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="b" type="text" value="'+b+'" />');
document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="c" type="text" value="'+c+'" />');
document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="d" type="text" value="'+d+'" />');
document.getElementById('myModal').innerHTML+=('<input size="80" name="reactie" type="text" class="textfield" />');
document.getElementById('myModal').innerHTML+=('<input type="submit" value="Toevoegen" />');
document.getElementById('myModal').innerHTML+=('</form>');
document.getElementById('myModal').innerHTML+=('<a class="close-reveal-modal">&#215;</a>');}

更新：我尝试在按钮onclick="this.form.submit()"的行内添加，但这也不起作用： - （

问题解决了！（感谢FrostbiteXIII的帮助）

Answer 1

它不喜欢的表格标签 - 如果你把它们放在第一位，我怀疑它会起作用。：）

例如：

<html>
<head>
<script>
function reactieID(a,b,c,d){ 
    document.getElementById('myModal').innerHTML+=('<div class="subtitel">Reactie</div>');
    document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="a" type="text" value="'+a+'" />');
    document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="b" type="text" value="'+b+'" />');
    document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="c" type="text" value="'+c+'" />');
    document.getElementById('myModal').innerHTML+=('<input hidden="hidden" name="d" type="text" value="'+d+'" />');
    document.getElementById('myModal').innerHTML+=('<input size="80" name="reactie" type="text" class="textfield" />');
    document.getElementById('myModal').innerHTML+=('<input type="submit" value="Toevoegen" />');
    document.getElementById('myModal').innerHTML+=('<a class="close-reveal-modal">&#215;</a>');
}
</script>
</head>
<body onload="reactieID('a','b','c','d')">
<form name="getTheInfo" method="post" action="actionpage.php">
    <div id='myModal'></div>
</form>
</body>
</html>

编辑：您甚至可以先指定表单标记：

<form name="getTheInfo" id="getTheInfo" method="post" action="">

然后将js添加到上面的函数中以指定要执行的操作，这仍然可以正常工作：

document.getElementById('getTheInfo').action = "actionpage.php";

Answer 2

提供一个将提交按钮与事件绑定的jQuery方法，如下所示：

<script>
$(document).on('click', 'input[type="submit"]', function(){
var self = $(this);
self.closest('form').submit();

});
</script>

Javascript | Button没有使用.innerHTML提交表单

2 个答案: