为什么更改后的值不显示在断点之后？第2部分

Question

通过JS值更改的制表符标题中的值不会在@media断点/手风琴屏幕上持久化--尽管选项卡内容区域中的值是持久化的。

js代码：

function check_1_input(X, Y) {  
  var ids=X.split("_"); console.log(' X '+X+' id '+ids[1]); 
  var PX=document.getElementById(X); 
  var PY=document.getElementById(Y); 
  PX.childNodes[0].textContent = "Changed"; 
  PY.childNodes[0].textContent = "Changed";
}

它所做的更改位于html的末尾--不确定为什么它只在那个位置工作。

小提琴是https://jsfiddle.net/PhilB/077dbf37/10/

Answer 1

您遇到的问题是在check_1_input函数中使用元素in。响应选项卡插件在初始化时克隆选项卡元素，使其具有基于媒体宽度的隐藏或公开的不同类的水平和垂直选项卡，但它保持it不变。因为您的函数正在使用getElementById查找元素，所以它只会找到第一个元素。

最终，您将得到两个具有相同ID的不同元素，这是错误的做法。使用类作为选择器而不是ID解决问题。我使用jQuery来选择类，而不是ID，因为您已经加载了jQuery。您可以考虑删除选项卡元素中的所有ID，因为响应选项卡插件总是会克隆它们并导致无效的DOM (两个ID相同的元素)。

看看我更新的版本你的小提琴这里。