0

如果我使用 asp.net 的 Web 用户控件，如何使用此代码？

</head>
<body>
    <form id="form1" runat="server">
    <div>

      <asp:CheckBox ID="CheckBox1" runat="server" /><br />
<asp:CheckBox ID="CheckBox2" runat="server" /><br />
<asp:CheckBox ID="CheckBox3" runat="server" /><br />
<asp:CheckBox ID="CheckBox4" runat="server" /><br />
<asp:CheckBox ID="CheckBox5" runat="server" /><br />
<asp:CheckBox ID="CheckBox6" runat="server" /><br />
<asp:CheckBox ID="CheckBox7" runat="server" /><br />
<asp:CheckBox ID="CheckBox8" runat="server" /><br />
<asp:CheckBox ID="CheckBox9" runat="server" /><br />
<asp:CheckBox ID="CheckBox10" runat="server" /><br />
        <asp:Button ID="Button1" runat="server" Text="Button" />
    </div>
    </form>
    <script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
    <title>Untitled Page</title>
    <script type="text/javascript">

      $("#sumit").click(function(){

    var vCheckedCBCount =  $("input:checkbox").filter(function(index){ 
    return $(this)[0].checked == true;
    }).length;
    if(vCheckedCBCount > 5)
    {
        alert('You cannot check more than 5 check box.');
        return false;
    } 
});
 </script >
</body>
</html>
4

2 回答 2

1

几件事：

第一的

  $("#sumit").click(function(){...}

正在寻找一个 id 为“smit”的 HTML 元素（# 表示 JQuery 中的 ID）。

如果您查看页面的源代码，您会看到 Button1 在由 ASP.Net 转换为 HTML 端按钮时不会具有该 ID，因为 ASP.Net 将生成一个相当难以阅读的唯一客户端 ID - 充满 $ 符号的东西并强调可能。

Jquery 可以使用 $('.myClass') - '.' 按其类找到您的按钮 表示“类”，就像“#”表示“ID”一样，只需将类添加submit到您的 ASP.Net 中Button1：

<asp:Button ID="Button1" runat="server" Text="Button" CssClass='submit' />

然后修改您的 JavaScript 调用：首先，通过将您的 javascript 包装在标准 JQuery 语法中来确保事件处理程序在文档准备就绪时连接起来：

$(document).ready(function () {
    //Your Javascript goes in here.
});

所以当重新工作时它看起来像这样（我已经移动了一些东西并取出了你的<title>元素。）

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $(".submit").click(function () {

            /* this code is here for demo purposes only - 5arx*/
            var numchecked = 0;

            $('input:checkbox').each(function () {
                if ($(this).attr('checked')) {
                    //alert('checked');
                    numchecked++;
                }
            });

            if (numchecked > 5) {
                alert('You cannot check more than 5 check box.');
            }

            return false; //This will stop your ASP.Net button submitting the form via a Postback.
            /* Your orginal code.
            var vCheckedCBCount = $("input:checkbox").filter(function (index) {
            return $(this)[0].checked == true;
            }).length;

            if (vCheckedCBCount > 5) {
            alert('You cannot check more than 5 check box.');

            }
            */
        });
    });
</script>
<div>
    <asp:CheckBox ID="CheckBox1" runat="server" /><br />
    <asp:CheckBox ID="CheckBox2" runat="server" /><br />
    <asp:CheckBox ID="CheckBox3" runat="server" /><br />
    <asp:CheckBox ID="CheckBox4" runat="server" /><br />
    <asp:CheckBox ID="CheckBox5" runat="server" /><br />
    <asp:CheckBox ID="CheckBox6" runat="server" /><br />
    <asp:CheckBox ID="CheckBox7" runat="server" /><br />
    <asp:CheckBox ID="CheckBox8" runat="server" /><br />
    <asp:CheckBox ID="CheckBox9" runat="server" /><br />
    <asp:CheckBox ID="CheckBox10" runat="server" /><br />
    <asp:Button ID="Button1" runat="server" Text="Button" CssClass="submit" />
</div>

希望这可以帮助。如需更多有用的 JQuery 内容，请访问 www.visualjquery.com - 它是一个交互式 JQuery 测试/学习工具。

嗯。祝你好运 ：-）

于 2011-01-27T12:15:26.757 回答
-1

$("#sumit")正在寻找一个 ID="smit" 的元素，而您的元素都没有。假设您想挂钩按钮的单击事件，请尝试$("#Button1").

于 2011-01-27T11:04:33.103 回答