2015-11-04 52 views
1

我想選擇ListBox中的多個項目,但是瀏覽器要求用戶按下CTRL來選擇多個項目,否則它只會選擇一個項目。如何在ListBox中多次選擇項目,而無需在Asp.Net中按CTRL?

我想選擇多個項目而不按CTRL,但我不想使用CheckBoxList。有沒有更好的方法來做到這一點?使用純JavaScript,或JQuery或Codebehind。

(我已經添加SelectionMode="Multiple"屬性ListBox控制)

代碼:

<asp:ListBox ID="ListBox1" runat="server" Height="210px" Width="203px" SelectionMode="Multiple"> 
     <asp:ListItem>1000</asp:ListItem> 
     <asp:ListItem>2000</asp:ListItem> 
     <asp:ListItem>4000</asp:ListItem> 
     <asp:ListItem>4000</asp:ListItem> 
     <asp:ListItem>5000</asp:ListItem> 
     <asp:ListItem>6000</asp:ListItem> 
    </asp:ListBox> 
+0

檢查此鏈接[製作一個標準的ASP.NET列表框做多選不按住Ctrl](http://josephschrag.blogspot.in/2010/11/making-standard-aspnet-listbox-do。 html)。我剛剛嘗試過,併爲我完美地工作。 –

+0

這個項目是否使用.NET Framework v2?在該框架的更高版本中,Multiple不需要ctrl併爲v2功能提供「擴展」。 –

回答

2

編號:Making a standard ASP.NET listbox do multiselect without holding Ctrl

您的列表框只是改變

<asp:ListBox ID="ListBox1" runat="server" Height="210px" Width="203px" SelectionMode="Multiple" onclick="ListBoxClient_SelectionChanged(this, event);"> 
     <asp:ListItem>1000</asp:ListItem> 
     <asp:ListItem>2000</asp:ListItem> 
     <asp:ListItem>4000</asp:ListItem> 
     <asp:ListItem>4000</asp:ListItem> 
     <asp:ListItem>5000</asp:ListItem> 
     <asp:ListItem>6000</asp:ListItem> 
</asp:ListBox> 

並添加下面的腳本在你的<script>標籤

<script type="text/javascript" language="javascript"> 
     var selectedClientPermissions = []; 

     function pageLoad() { 
      var ListBox1 = document.getElementById("<%= ListBox1.ClientID %>"); 

      for (var i = 0; i < ListBox1.length; i++) { 
       selectedClientPermissions[i] = ListBox1.options[i].selected; 
      } 
     } 

     function ListBoxClient_SelectionChanged(sender, args) { 
      var scrollPosition = sender.scrollTop; 

      for (var i = 0; i < sender.length; i++) { 
       if (sender.options[i].selected) selectedClientPermissions[i] = !selectedClientPermissions[i]; 

       sender.options[i].selected = selectedClientPermissions[i] === true; 
      } 

      sender.scrollTop = scrollPosition; 
     } 
</script> 
相關問題