ListBox和CheckBoxList，在没有for循环的情况下提醒所选项目

Question

我得到了ASP.NET ListBox和CheckBoxList，一旦更改，我就可以提醒所选项目，这在下面的代码段中完成，但我想去掉for循环。你能帮忙吗？

<asp:ListBox ID="ListBox1" runat="server" Width="10%" SelectionMode="Multiple">
    <asp:ListItem Selected="True" Value="1">White</asp:ListItem>
    <asp:ListItem Selected="False" Value="2">Black</asp:ListItem>
    <asp:ListItem Value="3">Red</asp:ListItem>
    <asp:ListItem Value="4">Green</asp:ListItem>
    <asp:ListItem Value="5">Blue</asp:ListItem>
</asp:ListBox>
<br />
<br />
<asp:CheckBoxList ID="CheckBoxList1" runat="server" Width="10%">
    <asp:ListItem Selected="True" Value="1">White</asp:ListItem>
    <asp:ListItem Selected="False" Value="2">Black</asp:ListItem>
    <asp:ListItem Value="3">Red</asp:ListItem>
    <asp:ListItem Value="4">Green</asp:ListItem>
    <asp:ListItem Value="5">Blue</asp:ListItem>
</asp:CheckBoxList>

JavaScript

$(document).ready
(
    function () 
    {
        $("#ListBox1").change
        (
            function () 
            {
                for (var i = 0; i < $("#ListBox1 :selected").length; i++) 
                {
                    alert("ListBox Number of Items: " + $("#ListBox1 option").length + "n"
                    + "ListBox Number of Selected Items: " + $("#ListBox1 :selected").length + "n"
                    + "ListBox Value: " + $("#ListBox1 :selected")[i].value + "n"
                    + "ListBox Text: " + $("#ListBox1 :selected")[i].text);
                }
            }
        );
    }
);
$(document).ready
(
    function () 
    {
        $("#CheckBoxList1").change
        (
            function () 
            {
                for (var i = 0; i < $("#CheckBoxList1 :input").length; i++) 
                {
                    if ($("#CheckBoxList1 :input")[i].checked) 
                    {
                        alert("CheckBoxList Number of Items: " + $("#CheckBoxList1 :input").length + "n"
                            + "CheckBoxList Number of Checked Items: " + $("#CheckBoxList1 input:checked").length + "n"
                            + "CheckBoxList Value: " + $("#CheckBoxList1 :input")[i].value + "n"
                            + "CheckBoxList Text: " + $("#CheckBoxList1 label")[i].innerHTML);
                    }
                }
            }
        );
    }
);

感谢

Answer 1

可以使用.each()方法循环遍历元素，this是指迭代中的当前元素。

$(document).ready
(
    function () 
    {
        $("#ListBox1").change
        (
            function () 
            {
                $("#ListBox1 :selected").each(function()
                {
                    alert("ListBox Number of Items: " + $("#ListBox1 option").length + "n"
                    + "ListBox Number of Selected Items: " + $("#ListBox1 :selected").length + "n"
                    + "ListBox Value: " + this.value + "n"
                    + "ListBox Text: " + this.text);
                }
            }
        );
        $("#CheckBoxList1").change
        (
            function () 
            {
                $("#CheckBoxList1 :input").each(function()
                {
                    if (this.checked) 
                    {
                        alert("CheckBoxList Number of Items: " + $("#CheckBoxList1 :input").length + "n"
                            + "CheckBoxList Number of Checked Items: " + $("#CheckBoxList1 input:checked").length + "n"
                            + "CheckBoxList Value: " + this.value + "n"
                            + "CheckBoxList Text: " + this.innerHTML);
                    }
                }
            }
        );
    }
);