zoukankan      html  css  js  c++  java
  • ASP.NET jQuery 随笔 显示CheckBoxList成员选中的内容

    通过jQuery来获取CheckBoxList成员内容。

     <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Web.Default" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="jquery-1.8.2.min.js" type="text/javascript"></script>
        <link href="Base.css" rel="stylesheet" type="text/css" />
        <style type="text/css">
           
        </style>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#<%=cblHobbies.ClientID%>").click(function () {
                    var msg = "";
                    $('#<%=cblHobbies.ClientID%> input[type="checkbox"]:checked').each(function () {
                       msg = msg + $(this).val() + ":" + $(this).next().text() + " "; // 这里的next()表示<label>
                    });
                    $("#message").text(msg);
                });
            });
           
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div style="margin: 100px auto;  400px; height: 200px;">
            <fieldset style=" 400px; height: 150px">
                <p>
                    请选择爱好</p>
                <asp:CheckBoxList ID="cblHobbies"  runat="server" >
                    <asp:ListItem Value="1">音乐</asp:ListItem>
                    <asp:ListItem Value="2">篮球</asp:ListItem>
                    <asp:ListItem Value="3">美剧</asp:ListItem>
                    <asp:ListItem Value="4">电影</asp:ListItem>
                  
                </asp:CheckBoxList>
            </fieldset>
            <br />
            <div id="message" style="color:Red;"></div>
        </div>
        </form>
    </body>
    </html>

    QQ截图20131212133606

  • 相关阅读:
    Vsftpd 3.0.2 正式版发布
    Putdb WebBuilder 6.5 正式版本发布
    SoaBox 1.1.6 GA 发布,SOA 模拟环境
    pynag 0.4.6 发布,Nagios配置和插件管理
    Percona Playback 0.4,MySQL 负荷回放工具
    xombrero 1.3.1 发布,微型 Web 浏览器
    Hypertable 0.9.6.4 发布,分布式数据库
    libmemcached 1.0.11 发布
    CryptoHeaven 3.7 发布,安全邮件解决方案
    Android Activity生命周期
  • 原文地址:https://www.cnblogs.com/jlcoder/p/3470957.html
Copyright © 2011-2022 走看看