不同form_tag上的输入字段生成相同的标签Id
是一个HTML表单中的常见问题。当在同一个页面上使用多个form_tag时，如果不指定不同的id属性，那么生成的输入字段将具有相同的标签id，这可能导致一些问题，例如无法正确地将表单数据提交到服务器。
为了解决这个问题，可以采取以下几种方法：
- 使用不同的id属性：在每个form_tag中，为输入字段指定不同的id属性。这样可以确保每个输入字段具有唯一的标签id，避免冲突。
- 使用不同的name属性：如果不需要使用id属性，可以使用不同的name属性来区分输入字段。name属性在表单提交时用于标识输入字段的名称，可以通过服务器端代码来处理不同的输入字段。
- 使用JavaScript动态生成id：可以使用JavaScript在页面加载时动态生成唯一的id属性。通过在每个form_tag上添加一个唯一的标识符，然后与字段类型或其他信息结合，生成唯一的id属性。
- 使用HTML5的新特性：HTML5引入了新的属性，如data-属性，可以用于存储自定义数据。可以使用data-属性来存储唯一的标识符，并在需要时使用JavaScript来处理。
总结起来，为了避免不同form_tag上的输入字段生成相同的标签id，可以通过指定不同的id属性、name属性，使用JavaScript动态生成id，或者使用HTML5的新特性来解决。在实际应用中，根据具体的需求和技术栈选择合适的方法来处理。
相关·内容
这是一个“最佳实践”问题。我仔细阅读了代码审查StackExchage站点，我看到了。Joseph Silber在其中建议，对于具有多行结构相同的表单输入的表单，应使用方括号表示法并完全避免使用it。
在我读过的关于网页设计/开发的书中，我从未见过使用过这种策略。在标签标签中使用方括号表示法和包装输入元素，以及在表单输入中不使用id标签是个好主意吗？也许Javascript/JQuery的某些特性使这种方法更具优势？
我想直接问Joseph这件事，但我在网站上还没有什么名气，所以我甚至不能发表评论。然而，我感兴趣的是社区对此的看法，因为到目前为止，搜索"HTML5括号表示法“和”类似H
浏览 3提问于2013-01-07得票数 5
回答已采纳
2回答
我对Javascript非常陌生，如果我没有使用正确的术语，很抱歉。
我有一个可以动态增长的表单。换句话说，每当用户单击标签和输入字段时，我都会添加按钮。
在表单的末尾，我希望有一个运行另一个JavaScript函数的“完成”按钮。
但是，我注意到所有输入字段都有相同的id (因为函数每次使id相同)。
访问这些变量的正确方法是什么？
下面是动态创建字段的函数。我还没有写好使用该表格的函数。
function buildDefaultFields(){
// Define container
var chargeItem_container = document.getElem
浏览 1提问于2013-07-30得票数 0
回答已采纳
我正在构建一个工具，我在其中插入了一些动态输入字段，以从用户获取输入。我从代码中克隆了一些div来创建不同的部分。我的div被成功克隆，但是附加到父div的事件总是被触发到父div，即使我单击子div事件。
我已经将$("#main").clone(true).insertAfter("#main");设置为将其默认布尔值更改为触发器事件。我不知道怎么做才能让它在每个克隆的div上工作，而不是在父div上工作。
这是我的输入表单
<form name="add_name" id="add_name">
浏览 0提问于2019-05-01得票数 1
我有一个可编辑的文件系统，用户可以在表单中提交更改。
我想使用文件的路径作为名称或ID标签。
因为我怀疑我是第一个面对这个问题的人，所以可能会有更好的方法。
示例：
path: ../../disney/mouse/mickey.php
已知的限制：
Jquery: no periods (.) and colons (:)
HTML : Only letter, digits,hyphens ("-"), underscores ("_"), colons (":"), and periods (".")
HTML5: All
浏览 0提问于2012-03-17得票数 1
回答已采纳
9回答
我使用HTML5来验证字段。我只需点击一下按钮就可以使用JavaScript提交表单。但是HTML5验证不起作用。只有当then输入类型为时，它才有效。除了使用JavaScript验证或将类型更改为submit之外，我们还可以执行其他操作吗
这是HTML代码：
<input type="text" id="example" name="example" value="" required>
<button type="button" onclick="submitform()"
浏览 3提问于2013-05-23得票数 62
回答已采纳
我有两个页面，这两个表单基本上是相同的，带条纹元素，但是一个有额外的字段，另一个没有。
带有额外字段的表单( event.preventDefault() )似乎没有停止表单提交，因此表单被提交了两次，但是没有额外字段的表单却没有。
为什么一个表单是isTrusted === true，另一个是isTrusted === false？是什么控制着这个？
这可能是preventDefault()不起作用的原因吗？
经过更多的测试，我发现：
<%= form_tag add_card_path(@product.id), id: "payment-form" do
不会提交两
浏览 0提问于2019-06-30得票数 2
回答已采纳
2回答
类与数据属性，自动字段初始化器
、、、、
一点背景
我用javascript/jQuery编写了一个方法，它循环遍历字段，并根据它们的内容设置它们，即下拉、自动完成、文本等等。
这样做的原因是，我专门为输入和文本区域设置了样式，页面加载后必须在javascript中初始化输入和文本区域。这个类中的方法循环遍历页面上的每个字段，并根据事件的内容设置事件。
目前，我正在通过给字段容器一个类来检测每个字段是什么，jQuery读取这个类并相应地设置字段如下：
<div id="company-container" class="autocomplete autocomplete-215 form-sprite&#
浏览 2提问于2012-10-30得票数 3
回答已采纳
1回答
所以我读了很多文章说HTML5表单验证是可以访问的(阻止表单提交的东西required属性是一个空白字段)，但是当我在Chrome上和BackTalk上测试我的表单时，如果我没有填写输入，它就会返回到输入字段(这很好！)但是两个屏幕阅读器都宣布“请填写这个字段”，这对用户来说是无用的，因为他们没有宣布该字段的标签。
那么，仅靠HTML5验证是不可访问的？另外，您能结合HTML5验证和自定义JS吗？
是否必须编写自定义客户端站点验证才能使表单可访问？
浏览 2提问于2020-01-23得票数 5
回答已采纳
我正在为一个主要的网站执行一个WCAG访问报告。可以预见的是，重复出现的问题之一是表单中的标签。
到目前为止，我一直认为将表单标签与其元素关联的正确方法是在标签的form属性中使用输入元素的名称，如下所示：
<label for="name[1]">Your name: </label>
<input type="text" name="name[1]" placeholder="Your name">
然而，客户端使用的框架更喜欢这样的代码：
<label for="user_f
浏览 1提问于2018-10-31得票数 1
2回答
我在同一个页面上有两个表单，两个标签带有for属性，指向两个具有相同ID和名称的复选框。
当我单击第二个表单标签之一时，它会检查第一个表单复选框。
在这种情况下，问题在于当您单击“x 2”标签时，它会检查“x”复选框，尽管它们是以不同的形式出现的：
.customCheckbox div label {
padding: 5px;
background-color: white;
border: 2px solid #aaaaaa;
background-image: none;
}
.customCheckbox div input {
marg
浏览 1提问于2016-03-23得票数 2
回答已采纳
我使用下面的代码动态地将barcode[]和description[]输入字段添加到我的表单中，使用onfocusout事件触发下面的get_barcode_data JS函数来获取条形码描述，但它只对单个barcode[]输入字段有效： <div>
<input type="text" id="barcode[]" name="barcode[]" onfocusout="get_barcode_data(this);"/>
</div>
<div>
<text
浏览 23提问于2019-03-02得票数 0
回答已采纳
我有一个有两个按钮的表单-一个是在表单末尾的“提交”按钮，在表单的中间有一个“添加”按钮，每当单击它时，它都会使用Javascript在表单中添加隐藏的输入元素。
下面是两个输入字段/add按钮：
<input name="name" required>
<input name="email" required type="email">
<button type="submit">Add</button>
然后是另一组输入字段：
<input name="title&
浏览 0提问于2012-04-17得票数 1
回答已采纳
1回答
我正在尝试准备具有多个(动态)输入的表单，以便通过ajax正确插入。
目前，使用我的php循环，我有4个div/forms。每个表单都有一个起始输入，在单击moreItems_add按钮时，它会动态添加另一个输入，每个表单/div最多添加10个。
这可以很好地工作。但是我添加了一个变量和console.log来记录我的隐藏输入的值，它应该为每个表单获取一个ID (<?php echo $ticker['ticker'] ?>)，但它目前只记录'1‘。所以当我单击第一个表单中的按钮时，它看起来是正确的，但当我单击其他表单时，它仍然是1。我想这是因为我在隐藏输入
浏览 1提问于2018-09-13得票数 0
2回答
我正在为网页可访问性编辑html代码，但我面临一个关于多个表单标签的问题。我正在使用Wave插件来检查网页的可访问性。
错误是多个表单标签，它意味着表单控件有多个与其关联的标签。
问题是，有一个页面用户可以输入用户信息，并且有一个按钮来调用弹出，如果用户没有输入该字段，弹出再次具有所有相同的字段来注册。
与在弹出窗口中更改字段的ID不同，是否有任何快速简便的方法来删除错误？
浏览 1提问于2019-07-05得票数 0
回答已采纳
有没有教程或者解释MVC3是如何使用HTML5数据标签实现无障碍的javascript的？我想知道如何为我自己的javascript扩展这种做法，特别是如何有效地解析数据标记来执行javascript，附加事件处理程序等？
浏览 0提问于2011-01-16得票数 2
回答已采纳
1回答
我有一个HTML页面，其中包含未知数量的表单。这些表单是使用PHP从SQL查询中填充的。由于未知数量的表单，我选择将每行设置为其自己的表单。对于提交，我只想提交已更改的表单。
我的第一个想法是使用javascript和一个与表单字段配对的"onChange“函数来确定表单ID，然后将这个表单ID输入到一个数组中，以便在最后提交时使用。
我尝试在父节点之间导航，但由于我制作表单的方式(使用表)，我无法获得表单ID。
换句话说，表的每一行都是一个表单。如果某一行被更改，我如何获取表单ID？下面是我的HTML的结构，表单部分重复了未知的次数。我不太擅长JQUERY，所以我更喜欢用JAVASC
浏览 14提问于2018-02-24得票数 0
2回答
我有一个html表单，可以使用jquery动态地添加输入元素。最后，我想提交/阅读表单上的所有数据。我使用了序列化方法，但它提供了最初在表单上的元素的数据，而不是动态添加元素的数据。
这是我的工作：
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript&#
浏览 1提问于2014-05-30得票数 0
回答已采纳
3回答
我有一个有多个提交按钮的表单，我正在通过JavaScript监听‘提交’事件。我想知道哪个submit按钮或form字段(如果用户按下'Enter/Return')触发提交事件。是否有一种方法可以获得用户单击或按下“Enter/Return”的HTML元素？
更新，因为人们不理解我：
这是在提交表单之前通过JavaScript进行的。不允许服务器端检测。我还需要处理提交的表单，通过用户按回车或返回。
码
<form action="" method="POST">
<input type="text" n
浏览 2提问于2011-07-20得票数 3
回答已采纳
我有一个带有输入“文本”字段的Symfony2表单，我用jQuery将其隐藏起来，以便使用一个自动完成字段来代替它(输入字段的css设置为："display: none")。由于该字段是必填字段，因此当我尝试提交表单而不进行选择时，会收到一条验证错误消息。然而，我遇到的问题是，HTML5客户端验证错误显示在浏览器窗口(附加在左下角)之外(冒泡)，而不是自动完成字段所在的位置。这是因为设置错误气泡位置的输入字段是隐藏的。
有没有一种简单的方法可以将错误气泡(来自HTML5表单验证)附加到另一个元素，使其显示在正确的位置？也许将它附加到输入字段的标签上，而不是小部件上？还是使用jQ
浏览 0提问于2012-08-21得票数 2
我有一个动态创建的带有重复元素的页面，如下所示：
<input type="file" name="file1">
<input type="file" name="file2">
<input type="file" name="file3">
我想向这些元素中的每一个添加一些数据，以便在JavaScript中使用。最初，我使用了“备用”属性，虽然在输入标签上有效，但在文件类型输入标记上无效，例如，size。现在，我已经将它添加到类属性中，但必须使用regex再
浏览 6提问于2014-05-12得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
