2 neil1225 neil1225 于 2016.02.25 12:37 提问

在jsp中如何实现如下的页面默认只显示一个下拉选的内容!
jsp

医疗卫生机构、如在“医疗卫生机构”选择“医院”则填如下信息:医院属性、医院类别、单位性质;如在“医疗卫生机构”选择“基层医疗卫生机构”则填如下信息:基层医疗卫生机构;是否在协同单位培训、协同单位(与单位公章对应的官方全称)、协同单位性质

 <td  colspan="3" align="left">
             <select id="medicalHealthInstitutions" name="medicalHealthInstitutions"        onchange="selectMedicalHealthInstitutions();" class="input_len1">
                                <option value="1" >医院</option>
                                <option value="2">基层医疗卫生机构</option>
                                </select>
                       </td>
                    </tr>
                    <tr id="hosInputs">
                        <td  align="right">
                            医院属性<c:if test="${fieldMap.hospitalProp eq 1}"><font color="#FF0000">*</font></c:if>
                        </td>
                        <td align="left">
                            <input type="text" id="hospitalProp" name="hospitalProp" maxlength="10" value="${extend.hospitalProp}" class="input_len1" elname="医院属性" pattern="string"  max_len="10" />
                        </td>
                        <td  align="right">
                             医院类别<c:if test="${fieldMap.hospitalType eq 1}"><font color="#FF0000">*</font></c:if>
                        </td>
                        <td align="left">
                            <input type="text" id="hospitalType" name="hospitalType" maxlength="10" class="input_len1" value="${extend.hospitalType}" elname="医院类别" pattern="string" max_len="10"  />
                        </td>
                        <td  align="right">
                            单位性质<c:if test="${fieldMap.unitProp eq 1}"><font color="#FF0000">*</font></c:if>
                        </td>
                        <td align="left">
                            <input type="text" id="unitProp" name="unitProp" maxlength="10"  value="${extend.unitProp}"class="input_len1" elname="单位性质" pattern="string" max_len="10" />
                        </td>
                    </tr>
                    <tr id="unitInputs">
                        <td  align="right">
                            基层医疗卫生机构<c:if test="${fieldMap.basicInstitutions eq 1}"><font color="#FF0000">*</font></c:if>
                        </td>
                        <td align="left" colspan="5">
                            <input type="text" id="basicInstitutions" name="basicInstitutions" maxlength="10" value="${extend.basicInstitutions}" class="input_len1" elname="基层医疗卫生机构" pattern="string"  max_len="10" />
                        </td>
                    </tr>

写一个function函数

3个回答

sinat_31535993
sinat_31535993   Rxr 2016.02.25 13:50

写个对应的div隐藏,然后根据下拉列表选中后显示出来

showbo
showbo   Ds   Rxr 2016.02.25 13:56

对应的分组信息tr放入tbody容器里面,设置tbody的显示隐藏,select非默认项的tbody隐藏起来

 <table><tr><td colspan="3" align="left">
    <select id="medicalHealthInstitutions" name="medicalHealthInstitutions" onchange="document.getElementById('tbYY').style.display = this.value == '1' ? '' : 'none'; document.getElementById('tbJC').style.display = this.value == '1' ? 'none' : ''" class="input_len1">
        <option value="1">医院</option>
        <option value="2">基层医疗卫生机构</option>
    </select>
</td>
                    </tr>
    <tbody id="tbYY">
        <tr id="hosInputs">
            <td align="right">
                医院属性<c:if test="${fieldMap.hospitalProp eq 1}"><font color="#FF0000">*</font></c:if>
            </td>
            <td align="left">
                <input type="text" id="hospitalProp" name="hospitalProp" maxlength="10" value="${extend.hospitalProp}" class="input_len1" elname="医院属性" pattern="string" max_len="10" />
            </td>
            <td align="right">
                医院类别<c:if test="${fieldMap.hospitalType eq 1}"><font color="#FF0000">*</font></c:if>
            </td>
            <td align="left">
                <input type="text" id="hospitalType" name="hospitalType" maxlength="10" class="input_len1" value="${extend.hospitalType}" elname="医院类别" pattern="string" max_len="10" />
            </td>
            <td align="right">
                单位性质<c:if test="${fieldMap.unitProp eq 1}"><font color="#FF0000">*</font></c:if>
            </td>
            <td align="left">
                <input type="text" id="unitProp" name="unitProp" maxlength="10" value="${extend.unitProp}" class="input_len1" elname="单位性质" pattern="string" max_len="10" />
            </td>
        </tr>
    </tbody>
    <tbody id="tbJC" style="display:none">
        <tr id="unitInputs">
            <td align="right">
                基层医疗卫生机构<c:if test="${fieldMap.basicInstitutions eq 1}"><font color="#FF0000">*</font></c:if>
            </td>
            <td align="left" colspan="5">
                <input type="text" id="basicInstitutions" name="basicInstitutions" maxlength="10" value="${extend.basicInstitutions}" class="input_len1" elname="基层医疗卫生机构" pattern="string" max_len="10" />
            </td>
        </tr>
    </tbody></table>
qq_34047461
qq_34047461   2016.02.25 14:19

可以把table添加一个td在checkbox后边,当checkbox触发改变事件后,再显示这个td中的信息

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
jsp页面,给下拉列表自动选中指定的选项
有很多时候我们需要选中下拉列表中的选项为我们数据库中保存的选项,那么如何做呢? " /> $(function(){ //类型的下拉列表 if($('#hidTypeId').val() != null && ""!=$('#hidTypeId')){ var num111 = $('#hidTypeId').val(); $("#txtnewsTy
请教:JSP里如何实现下拉组合框,既能从列表中选择也能自由输入,同时输入时自动定位到与已输字符最相符的列表项?
请教:JSP里如何实现下拉组合框,既能从列表中选择也能自由输入,同时输入时自动定位到与已输字符最相符的列表项?
jsp页面 下拉框实现页面跳转
function MM_jumpMenu(targ,selObj,restore){   eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");  if (restore) selObj.selectedIndex=0; }  ---教学院系---  油气资源与勘探技术教育部重点实验室  
jsp/html 实现下拉复选框
包括相应的js,css文件,这些都是经过测试的。是没有问题的
几种常用的下拉列表的动态加载和选中写法
前端开发中,常用的几种下拉框方式,包括:easyui中的combobox,combo,html中的select标签,struts2标签:。下面是我总结的这几种下拉框的动态加载和动态选中的写法,以防后面再遇到。 一、combobox,combobox:使用easyui插件远程请求数据方式    combobox,combobox:使用easyui插件远程请求数据方式     先定义input标
在jsp页面,下拉选框的写法
注意:这种写法在修改页面取值时,必须在跳转到修改页面对应的action中request.setAttribute("proclamatedIf") 一下。才能取到值!负责就要在修改页面的末尾加上如下js:  var jspi = ;  document.endAuditResultForm.proclamatedIf.options.item(jspi).selected = true;(当选
单击下拉菜单里面的选项实现跳转
jsp,实现单击下拉菜单的内容,直接跳转到相应界面。实现代码特别简单。
HTML基础 form-select创建只有一级的下拉列表,不选的时候只显示一个
慈心积善融学习,技术愿为有情学。善心速造多好事,前人栽树后乘凉。我今于此写经验,愿见文者得启发。 1、代码 C C++ C#
下拉框选中值对应切换内容的效果
下拉菜单中控制显示或隐藏 车辆选择 凯美瑞 雷凌 保时捷 雷诺 车辆昵称 VIN 车牌号 发动机号
网页中有两个table, 默认只显示第一个table,点击一个按钮后显示第二个table,第一个table隐藏
网页中有两个table, 默认只显示第一个table,点击一个按钮后显示第二个table,第一个table隐藏444 555 var f=-1; DisplayMyTable(); function DisplayMyTable() { if(1==f) { document.getElementById("t1").style.display="none"; document.getElem