使用 HTML 获取已提交表单之外的选中元素

Get checked elements outside of submitted form with HTML

本文关键字:元素 表单 HTML 获取 提交 使用      更新时间:2023-09-26

我有一个网页,顶部是一组单选按钮和一个提交按钮。这是代码:

<form action="/batch" method="POST">
    With checked selection you may: 
    <input type="radio" name="bulk" value="broadcast">Broadcast</input>
    <input type="radio" name="bulk" value="unbroadcast">Unbroadcast</input>
    <input type="radio" name="bulk" value="delete">Delete</input>
    <input type="submit" value="Run batch on checked items" />
</form>

在此下方,我有一个由一堆行组成的表格,开头带有复选框。代码是:

<td><input type="checkbox" name="{{ md5_name }}" class="box"/></td>

有没有办法让表单提交复选框是什么以及是否选中它们的列表,而不管复选框不在表单中?也许将其命名为相同或共享类?

在发布之前四处搜索时,我从此页面中找到了以下看起来很有希望的代码片段,但我不知道如何与我的 POST 方法一起运行它,或者我将如何将结果包含在我的 POST 方法中。

function getRadioValue (theRadioGroup)
    {
        for (var i = 0; i < document.getElementsByName(theRadioGroup).length; i++)
    {
        if (document.getElementsByName(theRadioGroup)[i].checked)
        {
            return document.getElementsByName(theRadioGroup)[i].value;
        }
    }
}

在 HTML 5 文档类型中,您可以使用 form 属性将这些表单元素与特定表单相关联:

<td><input form="formElementID" type="checkbox" name="{{ md5_name }}" class="box"/></td>

此属性:

指示作为元素1 所有者的窗体

引用:

  1. MDN:HTML 属性引用。

书目:

  • HTML 表单引用。

您可以将函数绑定到表单的提交方法以检索复选框的值,并将它们添加到表单中的隐藏字段中。

或者将复选框的默认值添加到隐藏字段,并将更改方法绑定到复选框以更新隐藏字段。