2015-11-04 56 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> 
相关问题