在不使用jquery的情况下使用javascript隐藏多个tr、div

如何根据复选框的结果隐藏多个表

<input type="checkbox" name="t_show" value="1"  checked="checked" onchange="visible_checkbox(this.id, 't_settings'); update_preview();" id="t_show"> 

谢谢各位

如何根据复选框的结果隐藏多个表

<input type="checkbox" name="t_show" value="1"  checked="checked" onchange="visible_checkbox(this.id, 't_settings'); update_preview();" id="t_show"> 

您是否意识到id是单数的，并且不能有多个元素具有相同的id

显示或隐藏元素与将显示设置为“无”一样简单

function visible_checkbox(checkboxId, tableId) {
    var isChecked = document.getElementById(checkboxId).checked;
    var showHide = isChecked ?"":"none";
    document.getElementById(tableId).style.display = showHide;
}

就我个人而言，我不会传递id，我只会传递对象，因为不会有额外的查找：

onchange="visible_checkbox(this, 't_settings');

JS代码

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    document.getElementById(tableId).style.display = showHide;
}

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    var ids = tableId.split(",");
    for(var i=0;i<ids.length;i++){
        document.getElementById(ids[i]).style.display = showHide;
    }
}

function visible_checkbox(checkbox) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    for(var i=1;i<arguments.length;i++){
        document.getElementById(arguments[i]).style.display = showHide;
    }
}

如评论所问，如何对多个ID执行此操作？

您可以拆分和循环：

onchange="visible_checkbox(this, 't1,t2,t3');

JS代码

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    document.getElementById(tableId).style.display = showHide;
}

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    var ids = tableId.split(",");
    for(var i=0;i<ids.length;i++){
        document.getElementById(ids[i]).style.display = showHide;
    }
}

function visible_checkbox(checkbox) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    for(var i=1;i<arguments.length;i++){
        document.getElementById(arguments[i]).style.display = showHide;
    }
}

JS代码

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    document.getElementById(tableId).style.display = showHide;
}

function visible_checkbox(checkbox, tableId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    var ids = tableId.split(",");
    for(var i=0;i<ids.length;i++){
        document.getElementById(ids[i]).style.display = showHide;
    }
}

function visible_checkbox(checkbox) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    for(var i=1;i<arguments.length;i++){
        document.getElementById(arguments[i]).style.display = showHide;
    }
}

功能可见\u复选框（复选框）{
var isChecked=checkbox.checked；
var showHide=isChecked？”：“无”；
对于（var i=1；iEDIT）：我刚刚想起document.getElementsByName（）存在一个很大的兼容性问题。

显示另一个使用.getElementsByTagName（）的替代方法。我仍然基于epascarello发布的方法：

您可以遍历所有div并搜索公共id模式（例如，使用
id=“xxx\u 1”
，
id=“xxx\u 2”
等：

function visible_checkbox(checkbox, baseId) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    var rows = rows.getElementsByTagName("tr");
    for (var i = 0; i < rows.length; ++i) {
        var id = rows[i].id.split("_")[0];
        if (id === baseId) 
            rows[i].style.display = showHide;  
    }
}

函数可见\u复选框（复选框，baseId）{
var isChecked=checkbox.checked；
var showHide=isChecked？”：“无”；
var rows=rows.getElementsByTagName（“tr”）；
对于（变量i=0；i



这是第一个响应（忽略）

使用“名称”而不是“id”，然后使用epascarello发布的方法：

function visible_checkbox(checkbox, tableNames) {
    var isChecked = checkbox.checked;
    var showHide = isChecked ?"":"none";
    var elements = document.getElementsByName(tableNames);
    for (var i = 0; i < elements.length; ++i) {
      elements[i].style.display = showHide;  
    }
}

函数可见\u复选框（复选框，表名）{
var isChecked=checkbox.checked；
var showHide=isChecked？”：“无”；
var elements=document.getElementsByName（表名）；
对于（变量i=0；i

您真的不应该有多个具有相同id属性的元素。Javascript和Html标准不喜欢这样。我如何执行这样的查询来替换多个tr，比方说使用同一个类。我如何使用class=“t\u设置”来执行此操作；你能建议一下传递多个ID的方法吗？->visible_复选框（这是“id1，id2，id3”）；谢谢你在我的帖子中回答了你关于如何使用多个ID的问题。