【问题标题】:Javascript check/uncheck all button for treeviewJavascript 检查/取消选中树视图的所有按钮
【发布时间】:2015-01-14 00:54:10
【问题描述】:

我想要一个链接按钮,当按下它时会检查/取消选中树视图上的所有复选框。如何使用 Javascript 实现这一点?

我研究并找到了这段代码,但我似乎无法让它工作。

function selectAllNone(value) {
        var tvNodes = document.getElementById("Treeview1");
        var chBoxes = tvNodes.getElementsByTagName("input");
        for (var i = 0; i < chBoxes.length; i++) {
            var chk = chBoxes[i];
            if (chk.type == "checkbox") {
                chk.checked = value;
            }
        }
        return false;
    }

【问题讨论】:

  • 您看到了什么错误?可以分享一下 HTML 吗?
  • 值未定义。 &lt;asp:UpdatePanel ID="UpdatePanel10" runat="server"&gt; &lt;ContentTemplate&gt; &lt;asp:TreeView Id="Treeview1" ShowCheckBoxes="All" ExpandDepth="0" runat="server"&gt; &lt;/asp:TreeView&gt; &lt;/ContentTemplate&gt;

标签: javascript asp.net checkbox treeview


【解决方案1】:

我用一些 HTML 测试了你的功能,它确实有效(我修改了按钮功能以切换所有复选框)

See JS Fiddle

function selectAllNone() {
var tvNodes = document.getElementById("trvMenu");   
var chBoxes = tvNodes.getElementsByTagName("input");
for (var i = 0; i < chBoxes.length; i++) {
    var chk = chBoxes[i];
    if (chk.type == "checkbox") {
        if(chk.checked == true)
        {
            chk.checked = false;
        }
        else if(chk.checked == false)
        {
            chk.checked = true;
        }
    }
}
return false;
}

<form method="POST">
<div id="trvMenu">    
    <input type="checkbox">check box 1</input><br>
    <input type="checkbox">check box 2</input><br>
    <input type="checkbox">check box 3</input><br>
    <input type="button" onclick="selectAllNone()">Toggle Check Boxes</input><br>
</div>
</form>

【讨论】:

  • 太好了,它工作了@angrybirdnut,只需将 getElementById 更改为 getElementById("");但是,如果您能再次帮助我,我希望它全部选中它们,即使选中了一个复选框,并且只有在选中所有复选框时才将它们全部关闭。你能帮我解决这个问题吗?
  • @MikeFerrer 我为复选框功能添加了一个功能。看看这个 JSFiddle:jsfiddle.net/angrybird/u8n8t7hh/25
  • 感谢您的帮助@angrybirdnut,但我想我没有正确解释自己。我想要的是,如果一个人选择了一个或两个复选框,然后单击全选按钮,它将选中所有复选框。如果全部被选中并且该人单击了按钮,它将全部取消选择。希望我能说清楚。再次感谢您的帮助。
  • @MikeFerrer 如果这次我理解正确...1)如果没有选中任何复选框,则单击“全选按钮”不会产生任何结果。 2) 如果至少选中了一个复选框,则单击“全选”会选中所有复选框。 3) 如果选中所有复选框,则单击“全选”会清除所有复选框。这是我在附加代码中实现的:jsfiddle.net/angrybird/u8n8t7hh/29
  • 2) 和 3) 是正确的,效果很好。但在 1) 中,它应该导致全部选中。你能帮我解决这个问题吗?很抱歉给您带来麻烦。
猜你喜欢
  • 2019-05-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-09-05
  • 2023-03-19
  • 1970-01-01
  • 1970-01-01
  • 2012-12-15
相关资源
最近更新 更多