0

嘿，伙计们，我只是简要介绍一下我正在尝试做的事情。我有一个正在处理的网络表单项目。用户将从他们想要生成的各种图像中进行选择，然后这会将他们带到我设置的打印页面。我的问题真的是我怎样才能做到，所以当他们选择例如 5 个复选框时，就会创建一个计数器。我需要这样做，因为我需要他们选择的项目的值（名称和 ID），以便我可以通过我的 rendor 方法为他们选择的每个项目运行它。如果我需要澄清任何事情或提供代码让我知道，任何见解都会很棒。谢谢！

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->

<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta name="HandheldFriendly" content="True" /><meta name="MobileOptimized" content="320" /><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link href="../Style/bootstrap.min.css" rel="stylesheet" />
    <link href="../Style/bootstrap-responsive.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../responsive.css" /> 
    <link href="../Style/custom.css" rel="stylesheet" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>    
    <script src="../Scripts/bootstrap.min.js"></script>
    <script src="../Scripts/modernizr-2.6.2-respond-1.1.0.min.js"></script>
        <style>
            body {
                padding-top: 60px;
                padding-bottom: 40px;
            }
        </style>

<title>
    Tag Manager - Microsoft Tagger
</title></head>
<body>
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
        <![endif]-->    
        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </a>
                    <a class="brand" href="../../index.aspx">Microsoft Tagger</a>
                    <div class="nav-collapse collapse">
                        <ul class="nav">
                            <li class="active"><a href="../../index.aspx">Home</a></li>
                            <li><a href=AddDevice.aspx>Create Tags</a></li>
                            <li><a href="Tagmanager.aspx">Tag Manager</a></li>
                            <li><a href="../../Pages/AddUsers/">User Management</a></li>
                            <li><a href="Settings.aspx">Settings</a></li>
                        </ul>
                       <p class="navbar-form pull-right"><a id="Login" class="btn" href="../../Pages/Login">Sign in</a></p>

                    </div><!--/.nav-collapse -->
                </div>
            </div>
        </div>  

    <form method="post" action="Tagmanager.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__LASTFOCUS" id="__LASTFOCUS" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="kySKwYuYhADD7C7+Jm7X9fUBwjV+kIHbMCI0kvXuSfynnBUPeh4pnGsODmU3CAfbMp1TeQ8r8F9jt9/QJRshNrAFDPrHwcvFsa0P1B47SvP0R4o5mzuybq/mD3zJJndCYd2fJsQIKewHI1K4KSaLK26prYNaJEM6+czXb7Tb1CwnOKg/T2YePZ74nbS4655EF12gaSG4A54rsMmjQUjjLzZ7OZ5CKXvKh3Rd3c9PBQTDpcmIzBdahQNzjydsJEhQCNAizCaH0rXEcgkL1OzIjyyfqD+O0LiK7CxtJ53xgMjtSIO/KEqJ9Wk0lssvfj6wPWxa7/y+r3oRH4XyAqtS3UisNvouSTEBb1skfXjgeaw8Xmyivx4JurRPZW+6qn4tEYrO6HjZ3HPXy2F2JjSS2V7YLS5An7no2hKl7W+nDQxQS+ghVEj5REyXSl1g/GBnYHbAM2L37070hVrv0UjItBVIp8wPdBkU70utht2ax2K3K99l6IF2M3d1ruMROiIPJKPy8pFZfN51cUyw36X5cRCMaotCGia88ebTUn2HbWx5Ehjv2dNRkRRG6zVe5HuuOiBGPgcuDKQyS/r/PtuwGegDEGnS+sXICji2fX58lxpSvuIQkKb4Z3UItbesK3pdBTn9JwHyOgQZLJtV7l6lmoUOoC+PQ7Xtk1AViPJG41aSlbY5F+9ufVM6+LtkTLMoGHHDdrLI0xwn1h+iuh1mrWObUy+WMbmr2Jw89f+YHD0kuM9bjwXgeDM7wJvTSpDDjJwiFG0JGXBBBAv4QEtitDSOaZDwbTukpnX1iUHaaaWb/OGdcQXPdzhjftBlFqNPxHtFl6kAtfsW8k+azjKYt+KWrn5JA8fa5r9HVWhBt0UuTbva2JFZSniVC6HBu1azifl6u/U4zOftyeEm83Qvkau0KhqmohRXNMQQpnGNXcFwCUWSgo7kSCWlkUXyhfq4G9SiJkaSS/h/DFzXy7RxA9COWWZkPcFxkDIL5u/vjTJEa3ZNEP5mjQocDSOXvXXZ2Mk2DIVuR9rPc+VNxh/WD7ocNcoNGtT7JDxy7r7sreVcu0/WGoMdM4e2BaR9CUFzM6i1KC3zHLeyK1T+ObeVBapwzmFZmtqJrgd7gQmxjjhsoipQzeiCXVhONL5rRuEY9Qew6qwBCT69oJchNx6yvw==" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<div class="aspNetHidden">

    <input type="hidden" name="__VIEWSTATEENCRYPTED" id="__VIEWSTATEENCRYPTED" value="" />
    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="0U4EGzWCcoTaWrHPEXFALcyG6KeUGI5GzpVV1Quz301fDa3jk60YWGJFj9oyrhtGDQH0ePQh4WaGqNELyjnORNWQ9hnQ+XXnNPk2CbYzJPDboBMa8xsieJfP7kX16ZH/1Q1Mt+s7B1Zt96GBDByuGCYapMWTWE98P++r1iMP/t584oI6LrnBugV6Vd/KNp57q1Z7ynCsD7xE/hVjlPlIromSrxk36YUgYsaEBE3uSYUpIotu1r+LIhRCLGcaf0Pytoto5/Hqm7jWZaqcAzWFFOPbKtskfvkw2iPY8hbUXLI=" />
</div>
    <div class="container">

    <br/><br />
            <select name="ctl00$ContentPlaceHolder1$ddListDeviceType" onchange="javascript:setTimeout(&#39;__doPostBack(\&#39;ctl00$ContentPlaceHolder1$ddListDeviceType\&#39;,\&#39;\&#39;)&#39;, 0)" id="ContentPlaceHolder1_ddListDeviceType">
    <option selected="selected" value="0">All</option>
    <option value="2">Desktop</option>
    <option value="3">Laptop</option>
    <option value="4">Tablet</option>
    <option value="5">Other</option>

</select>


    <div>
    <table class="table table-bordered table-hover" cellspacing="0" rules="all" border="1" id="ContentPlaceHolder1_gvProducts" style="border-collapse:collapse;">
        <tr>
            <th scope="col">Name</th><th scope="col">Location</th><th scope="col">Status</th><th scope="col">Product Type</th><th scope="col">Options</th><th scope="col">Options</th><th scope="col">&nbsp;</th>
        </tr><tr>
            <td>Surface RT</td><td>Device Bar</td><td>Inactive</td><td>Tablet</td><td><a class="btn btn-primary" href="EditPage.aspx?id=10">Edit</a></td><td><a class="btn btn-danger" href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolder1$gvProducts&#39;,&#39;Delete$0&#39;)">Delete</a></td><td>
                    <input value='Surface RT,QsTD4zibjE' type="checkbox" />

                </td>
        </tr><tr>
            <td>Dell Desktop</td><td>Device Bar</td><td>Active</td><td>Desktop</td><td><a class="btn btn-primary" href="EditPage.aspx?id=11">Edit</a></td><td><a class="btn btn-danger" href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolder1$gvProducts&#39;,&#39;Delete$1&#39;)">Delete</a></td><td>
                    <input value='Dell Desktop,sg49r6lnm0' type="checkbox" />

                </td>
        </tr><tr>
            <td>VAIO Duo 11 Ultrabook</td><td>Device Bar</td><td>Active</td><td>Tablet</td><td><a class="btn btn-primary" href="EditPage.aspx?id=17">Edit</a></td><td><a class="btn btn-danger" href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolder1$gvProducts&#39;,&#39;Delete$2&#39;)">Delete</a></td><td>
                    <input value='VAIO Duo 11 Ultrabook,zz3JBGxdIU' type="checkbox" />

                </td>
        </tr>
    </table>
</div>



        <hr>enter code here
            <footer>
                <p>&copy; Company 2012</p>
            </footer>
    </div>
    </form>
</body>
</html>
4

2 回答 2

1 
$(".myCheckBox").click(function(){
    var count = $(".myCheckBox:checked").length;
   if(count == 5)
     //do something..
});

这假设您的复选框具有“myCheckBox”类。

于 2013-04-06T21:31:04.933 回答
0

一旦选中（或未选中）就计算任何选中的复选框..试试这个http://jsfiddle.net/U7H3s/

$('input[type=checkbox]').click( function(){
   $('#countChecked').html($('input[type=checkbox]').filter(':checked').length);
});
于 2013-04-06T21:36:20.153 回答