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函数中使用了元素ID。响应选项卡插件在初始化时克隆选项卡元素，以使水平和垂直选项卡具有基于媒体宽度隐藏或公开的不同类，但它保持ID相同。由于您的函数正在使用getElementById查找元素，因此它只会找到第一个元素。

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

请参阅我的小提琴here的更新版本。

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

1 个答案: