ListBox 및 CheckBoxList, for 루프없이 선택한 항목에 경고합니다.

Question

ASP.NET ListBox 및 CheckBoxList가 있고 onchange는 다음 코드 조각에서 수행 된 선택한 항목을 경고합니다. 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> 

자바 스크립트

$(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

당신은 this가 반복 처리의 현재의 요소를 참조하는 요소를 통해 루프에 .each() 방법을 사용할 수 있습니다.

$(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); 
        } 
       } 
      } 
     ); 
    } 
);