zoukankan      html  css  js  c++  java
  • 多选框数据绑定,js控制显示隐藏选中等方法

                    <td  style="background:#F3F8FD; border-top-style: none; border-top-color: inherit; border-top- medium;" 
                        class="style1">投资分阿类:</td>
                    <td colspan="3"; style="background:#F3F8FD;795px;padding-left:1px;border-top:none;">
                    <div id="gdzc" style="display:none;">
                    <input name="dxgdzc" type="checkbox" runat="server" id="shebei" value="设备" />设备
                    <input name="dxgdzc" type="checkbox" runat="server" id="scjd" value="生产基地" />生产基地
                    <input name="dxgdzc" type="checkbox" runat="server" id="fjyxdbgfjj" value="非经营性地、办公房基建" />非经营性地、办公房基建
                    <input name="dxgdzc" type="checkbox" runat="server" id="bgglyfzx" value="办公管理用房装修" />办公管理用房装修
                    </div>
    上面的定义了name,type等属性的多选框.<div id="gdzc" style="display:none;">使其初始状态为隐藏.通过js来控制的.
    <div id="dwtz" style="display:none;"> <input name="dxdwtz" type="checkbox" runat="server" id="jcss" value="基础设施" />基础设施 <input name="dxdwtz" type="checkbox" runat="server" id="fdc" value="房地产" />房地产 <input name="dxdwtz" type="checkbox" runat="server" id="tdcbj" value="土地储备金" />土地储备金 <input name="dxdwtz" type="checkbox" runat="server" id="guquan" value="股权" />股权 <input name="dxdwtz" type="checkbox" runat="server" id="jinron" value="金融" />金融 </div> </td>
    通过js控制多选框的显示隐藏,选中状态等           

    function selchange() { //$("#seltype").empty(); var sel = $("#selinvestmentType").val(); if (sel == "固定资产") { $("#gdzc").css('display', 'block'); $("#dwtz").css('display', 'none'); $("#jcss").attr("checked", false); $("#fdc").attr("checked", false); $("#tdcbj").attr("checked", false); $("#guquan").attr("checked", false); $("#jinron").attr("checked", false); } else if (sel == "对外投资") { $("#gdzc").css('display', 'none'); $("#dwtz").css('display', 'block'); $("#shebei").attr("checked", false); $("#scjd").attr("checked", false); $("#fjyxd").attr("checked", false); $("#bgfjj").attr("checked", false); $("#bgglyfzx").attr("checked", false); } else if (sel == "") { $("#gdzc").css('display', 'none'); $("#dwtz").css('display', 'none'); $("#shebei").attr("checked", false); $("#scjd").attr("checked", false); $("#fjyxd").attr("checked", false); $("#bgfjj").attr("checked", false); $("#bgglyfzx").attr("checked", false); $("#jcss").attr("checked", false); $("#fdc").attr("checked", false); $("#tdcbj").attr("checked", false); $("#guquan").attr("checked", false); $("#jinron").attr("checked", false); } }
  • 相关阅读:
    CentOS上手动配置nginx.services
    Mac安装软件时,提示文件已损坏,需要移动到废纸篓的解决方法
    Jumpserver安装部署
    Linux服务器测试带宽
    Zabbix_server执行window脚本出现中文乱码如何解决
    四行shell脚本实现Zabbix_server 的高可用
    Kubernetes Pod故障归类与排查方法
    Nginx配置location与rewrite规则教程
    ipa文件信息检查工具
    申请免费SSL证书
  • 原文地址:https://www.cnblogs.com/Zpyboke/p/5156790.html
Copyright © 2011-2022 走看看