显示/隐藏<跨度>标签

Show/Hide <span> tags

本文关键字：跨度 标签 隐藏 显示      更新时间：2023-09-26

我想使用 javascript 隐藏具有特定 id 或类的标签。我为每个跨度标签保留了一个 ID 和 CLASS，称为"ch"（为每个跨度添加不同的 ID 和 CLASS 对我来说非常困难）
我有一个复选框，它将切换 .
现在问题来了：
- 我点击复选框一次，一切都隐藏得很好
- 第二次单击它（再次显示），标签中的所有内容都转到屏幕左侧。
- 再次点击它，一切都变得疯狂

我希望代码在单击和隐藏跨度时显示/隐藏 span 标签，我不希望该行保留在那里。我希望删除整行，当它再次设置为可见时，我希望这些行重新出现。我希望有人能帮助我。下面是代码：

function sh_chords() {
    tmp_log += "sh_c|";
    var b = document.getElementById("showing_chords").checked;
    for (i = 1; i <= lcnt; i++) {
        el = document.getElementById("ch");
        try {
            if (!b) {
                el.style.color = "black";
                el.style.cursor = "default";
                $(".ch").hide();
            } else {
                el.style.color = "#0000FF";
                el.style.cursor = "pointer"
                $(".ch").show();
            }
        } catch (d) {}
    }
}

由于您使用的是jquery，因此您可以使用它的辅助函数，该函数专门用于切换可见性。

$('.ch').toggle( $('#showing_chords').prop('checked') );
相关文章：