我遇到了一个奇怪的问题：我试图从javascript中获取一个<form>元素，但我无法做到。
我的HTML代码是由PHP动态创建的：
<form id="form_color_{$color->id}" action="?com=saveColor" method="POST">
<!--some input elements-->
<a href="javascript:saveColor({$color->id})">
<img src="{$webSiteUrl}assets/img/admin/floppy_disk_24.png" />
<span> Save</span>
</a>
</form>
因此，该页面将包含各种form_color_形式，例如form_color_1 form_color_2等...
当单击图像时，将调用此JavaScript函数：
function saveColor(id){
$("#form_color_"+id).submit();
}
功能正确接收 ID 参数，但不提交表单。
如果我尝试获取表单元素，我会得到空
function saveColor(id){
form = 'form_color_'+id;
var doc = document.getElementById(form);
alert(doc);
$("#form_color_1").submit();
}
该功能可与其他形式完美配合。
下面是 PHP 生成的代码示例：
<form id="form_color_1" action="?com=saveColor" method="POST">
<!--some input elements-->
<a href="javascript:saveColor(1)">
<img imgc="http://10.10.10.46/c5liveOnLine/assets/img/admin/floppy_disk_24.png" />
<span> Save</span>
</a>
</form>
我错过了什么？
你所拥有的应该有效，当然，除非页面上有另一种具有相同id的表单（这会很糟糕）。
但请注意，您根本不需要id，因此如果id问题是问题所在，解决方案就是不使用它们。只需给你的触发元素一个类：
<form action="?com=saveColor" method="POST">
<!--some input elements-->
<a class="submit-form">
<img src="{$webSiteUrl}assets/img/admin/floppy_disk_24.png" />
<span> Save</span>
</a>
</form>
。然后使用处理程序提交包含元素的表单：
$(document).on("click", ".submit-form", function() {
$(this).closest("form").submit();
});
我使用了委托处理程序，因为我没有看到任何理由不这样做，这意味着您可以根据需要动态添加和删除表单。
但请注意，你根本不需要JavaScript，除非你做的不仅仅是提交表单。 button元素的样式可以设置为您希望它们外观的任何方式，其默认操作是提交它们所在的表单。所以：
<form action="?com=saveColor" method="POST">
<!--some input elements-->
<button>
<img src="{$webSiteUrl}assets/img/admin/floppy_disk_24.png" />
<span> Save</span>
</button>
</form>
只需使用 CSS 使按钮看起来像您想要的样子。
下面是一个样式button示例，看起来像一个链接：
button {
border: none;
background-color: transparent;
color: blue;
}
button:hover {
text-decoration: underline;
}<form action="?com=saveColor" method="POST">
<!--some input elements-->
<button>
<img src="{$webSiteUrl}assets/img/admin/floppy_disk_24.png" />
<span> Save</span>
</button>
</form>