102

我很好奇<input type="hidden">标签的最初用途。

如今,它经常与 JavaScript 一起使用,将变量存储在其中,然后发送到服务器等。

因此,在 JavaScript之前<input type="hidden">就存在了,那么它的初衷是什么?我只能想象从服务器向客户端发送一个值(不变),以维持一种状态。还是我在它的历史上弄错了什么并且总是应该与 JavaScript 一起使用?<input type="hidden">

如果可能的话,也请在你的答案中提供参考。

4

5 回答 5

108

我只能想象从服务器向客户端发送一个值(不变),以维持一种状态。

恰恰。事实上,它今天仍然被用于此目的,因为我们今天所知道的 HTTP 仍然,至少从根本上说,是一个无状态协议。

这个用例实际上是在HTML 3.2中首次描述的(我很惊讶 HTML 2.0 没有包含这样的描述):

type=hidden
这些字段不应被呈现,并为服务器提供一种通过表单存储状态信息的方法。这将在提交表单时使用相应属性定义的名称/值对传递回服务器。这是针对 HTTP 无状态的解决方法。另一种方法是使用 HTTP“Cookies”。

<input type=hidden name=customerid value="c2415-345-8563">

虽然值得一提的是,HTML 3.2 仅JavaScript 最初发布后才成为 W3C 推荐标准,但可以肯定的是,隐藏字段几乎总是起到相同的作用。

于 2013-04-30T06:43:27.090 回答
10

我将在这里提供一个简单的服务器端真实世界示例,例如,如果记录是循环的,并且每条记录都有一个带有删除按钮的表单,并且您需要删除特定记录,那么这个hidden字段就在起作用,否则你赢了t 获取在这种情况下要删除的记录的引用,它将是id

例如

<?php
    if(isset($_POST['delete_action'])) {
        mysqli_query($connection, "DELETE FROM table_name 
                                   WHERE record_id = ".$_POST['row_to_be_deleted']);
                                   //Here is where hidden field value is used
    }

    while(condition) {
?>
    <span><?php echo 'Looped Record Name'; ?>
    <form method="post">
        <input type="hidden" name="row_to_be_deleted" value="<?php echo $record_id; ?>" />
        <input type="submit" name="delete_action" />
    </form>
<?php
    }
?>
于 2013-04-30T06:45:06.450 回答
8

简而言之,最初的目的是制作一个将与表单提交一起提交的字段。有时,需要在隐藏字段中存储一些信息(例如,用户的 id)并通过表单的提交提交。

来自 HTML 1995 年 9 月 22 日的规范

带有 `TYPE=HIDDEN' 的 INPUT 元素表示隐藏字段。用户不与此字段交互;相反,VALUE 属性指定字段的值。NAME 和 VALUE 属性是必需的。

于 2013-04-30T06:42:44.277 回答
6

表单元素的值包括 type='hidden' 会在表单发布时提交给服务器。input type="hidden" 值在页面中不可见。例如,在隐藏字段中维护用户 ID 是众多用途之一。

SO 使用隐藏字段进行投票。

<input value="16293741" name="postId" type="hidden">

使用此值,服务器端脚本可以存储 upvote。

于 2013-04-30T06:49:27.477 回答
5

基本上隐藏字段与多步表单一起使用会更有用和更有优势。我们可以使用隐藏字段将一步信息传递给下一步使用隐藏并保持转发直到结束步骤。

  1. CSRF 代币。

跨站请求伪造是一个非常常见的网站漏洞。在所有表单提交中要求一个秘密的、用户特定的令牌将防止 CSRF 攻击,因为攻击站点无法猜测正确的令牌是什么,并且他们代表用户执行的任何表单提交总是会失败。

  1. 在多页表单中保存状态。

如果您需要在多页表单中存储用户当前所在的步骤,请使用隐藏的输入字段。用户不需要查看此信息,因此将其隐藏在隐藏的输入字段中。

一般规则:使用该字段存储用户不需要查看但您希望在提交表单时发送到服务器的任何内容。

于 2013-04-30T06:47:31.533 回答