1

我正在尝试编写一个javascript函数,当第一个复选框“全部”被选中时,取消选中所有其他选项。此列表项在 cbxlOption 中的索引为 0,值为 -1,如下所示。如何获取我选择的复选框的值,以便我可以完成下面的 javascript?非常感谢你的帮助!

<asp:CheckboxList ID="cbxlOptions" runat="server" >
    <asp:ListItem Text="All" Value="-1" />
    <asp:ListItem Text="Option 1" Value="0" />
    <asp:ListItem Text="Option 2" Value="1" />
    <asp:ListItem Text="Option 3" Value="2" />
</asp:CheckboxList>



function UncheckOptions( cbxListID, cbxID )
{
  var checkedValue = null; 
  var cbxListID = document.getElementById( cbxListID );
  var cbxArray = cbxListID.getElementsByTagName( 'input' );

  checkedValue = document.getElementById( cbxID ).value;

          //--uncheck everything else other than the first checkbox(index=0)
  if (checkedValue < 0)  
  {
    for (var i=1; cbxArray[i]; ++1)
    {
        cbxArray[i].checked = false;
    } 
  }
  else                     //--checkedvalue > 0, uncheck "ALL" 
  {
  cbxArray[0].checked = false;

  }

}

这不是确切的代码(因为我在 asp.net 中编码),但希望对您有所帮助。 http://jsbin.com/utuvuy/20/

我将 javascript 函数添加到每个复选框,如下所示:

For Each item As ListItem In cbxlOptions.Items
            item.Attributes.Add("onclick", "UncheckOptions('" & _
                             cbxlStatus.ClientID.ToString & "',this.id);")
Next
4

2 回答 2

0

由于您只对单击“全部”以取消选中所有其他选项感兴趣,因此您只需将您的功能应用于该特定复选框。您可以在 JS 中执行此操作,而无需将其嵌入 HTML。此外,对于复选框,您想要onchange而不是onclick.

试试这个:

JSBin

var all = document.getElementById('cbx0');
all.onchange = function() {
    if(this.checked) {
        UncheckOptions(cbx0);
    }
};

function UncheckOptions(id)
{
    var cbxListID = document.getElementById(id);
    var cbxArray = document.getElementsByTagName( 'input' );

  //--uncheck everything else other than the first checkbox(index=0)
    for(var i=1; i < cbxArray.length; i++) {
        cbxArray[i].checked = false;
    }
}
于 2013-09-18T18:32:28.667 回答
0

给定您的 HTML,在您的复选框中添加一个类(我使用cb了 class )(而不是 Check All 一个)。在您的内联更改处理程序中,this作为参数传递给函数并使用以下 JS:

function doAll(obj) {
    var cb = document.getElementsByClassName("cb");

    for (var i = 0; i < cb.length; i++) {
        cb[i].checked = obj.checked;
    }
}

HTML

<input type="checkbox" id="cbx0" value="-1" onclick="doAll(this)">All

演示:http: //jsfiddle.net/tymeJV/FAbZG/

于 2013-09-18T18:24:56.633 回答