判断多选框选择数量，并将选择的value拼接到另一个字符串

最新推荐文章于 2024-05-21 13:13:33 发布

我得到的都是侥幸啊

最新推荐文章于 2024-05-21 13:13:33 发布

阅读量506

点赞数

CC 4.0 BY-SA版权

分类专栏： js jstl

本文链接：https://blog.csdn.net/single0515/article/details/108862948

js 同时被 2 个专栏收录

5 篇文章

订阅专栏

jstl

4 篇文章

订阅专栏

本文介绍了一种方法，用于在用户选择多个特殊项目费用后，动态显示分配金额的输入框，并将选中项目的value值拼接到一个字符串中。通过JavaScript函数`countSelectNum()`检查选中的多选框数量，当选择超过一项时，显示分配金额的输入框，并根据特定条件显示或隐藏其他元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

应用场景：自行选择特殊项目费用放置位置，若选择多个，自行选择在每项中的分配金额

jsp：

<div id="tsxm" class="control-group" style="display: none">
               <label class="control-label" style="width: 200px;">特殊项目费用：</label>${xxx.tsxmf}
               <div class="controls">
                   <label><input type="checkbox" name="tsxmwz" value="4" checked="checked" onclick="countSelectNum();">待摊基建支出</label>
                   <label><input type="checkbox" name="tsxmwz" value="5" onclick="countSelectNum();">固定资产</label>
                   <label><input type="checkbox" name="tsxmwz" value="6" onclick="countSelectNum();">流动资产</label>
                   <label><input type="checkbox" name="tsxmwz" value="7" onclick="countSelectNum();">长期待摊费用</label>
                   <label><input type="checkbox" name="tsxmwz" value="8" onclick="countSelectNum();">无形资产</label>
               </div>
           </div>

注：tsxmMap在service赋值，key值确定，value值自行填写
           <div id="tsxmfValue" class="control-group" style="display: none">
                <div class="controls">
                      <c:forEach items="${xxx.tsxmMap}" var="tsxmf">
                          <label class="control-label" style="width: 200px;">${tsxmf.key}：</label>
                        <label><input name="tsxmMap['${tsxmf.key}']" type="text" class="input-large"/></label><br/>
                      </c:forEach>
                </div>
           </div>

js：

           //与上述无关，判断选择上述多选框选择固定资产或流动资产，显示id为ts的div
           if(tsxmXswz.indexOf("5") != -1 || tsxmXswz.indexOf("6") != -1){
               $("#ts").show();
           }else{
               $("#ts").hide();
           }
       }