Question

我使用css display: none;隐藏div内容，并使用Featherlight窗口显示它。

我在其他JavaScript访问的内容中有一些ID。

问题是，当Featherlight从我隐藏的div创建一个模态窗口时，id会被复制。一个在隐藏的div中，一个在窗口中。

现在JS控件只能看到隐藏div中的id而不是Featherlight窗口中的id。所以窗户里面什么都没有。

我该如何解决这个问题？

https://jsfiddle.net/fpunL1nk/（窗口未覆盖jsfiddle中的屏幕）

JS

<!-- Featherlight Button -->
<a href="#" data-featherlight="#window">Open Featherlight</a>

<!-- Featherlight Window -->
<div class="hidden">
  <div id="window">
      <div id="content">
        This ID is duplicated.
      </div>
  </div>
</div>

id =“content”重复。

CSS

.hidden { 
  display:none; 
 }
#window { 
  width:400px;
  height:250px;
  background:white;
  border:1px solid black; 
}

Answer 1

我有同样的问题。您可以在打开对话框时禁用源HTML输入，因此只有弹出窗口中的输入才会在表单提交时发送到服务器。

Featherlight JS在HTML中创建重复ID？

1 个答案: