如何在 HTML 中模拟 POST 数据的只读 SELECT 标签？

在 HTML 中模拟 POST 数据的只读 SELECT 标签

虽然 HTML 规范允许使用禁用属性禁用 SELECT 元素，但这会阻止其值包含在 POST 或 GET 请求中。当所需的行为是阻止用户修改选择但仍保留其提交值时，这就构成了挑战。

要克服此问题并在保留 POST 数据的同时实现只读功能，建议采用两步方法:

1. 保持 SELECT 禁用：维护 SELECT 元素上的禁用属性以防止用户
2. 添加隐藏输入：创建一个与 SELECT 具有相同名称属性的隐藏输入元素，并将其值设置为 SELECT 的当前值。

如果您稍后希望启用 SELECT 元素，请按照以下步骤操作步骤：

1. 重新启用 SELECT：从 SELECT 中删除禁用的属性并将其 name 属性设置回其原始值。
2. 同步with Hidden Input：在 SELECT 的 onchange 事件中，将其值复制到隐藏输入以确保一致性。

这里有一个代码示例来说明这种方法：

<form>

$('#animal-select').change(function() {
  $('#animal').val($(this).val());
});

以上是如何在 HTML 中模拟 POST 数据的只读 SELECT 标签？的详细内容。更多信息请关注PHP中文网其他相关文章！