Question

我一直在寻找其他帖子的解决方案，但我找不到，我也无法理解其他解决方案。

我想根据选择值显示td或其他。这个td是在一个循环中，用一个键创建表的每一行动态。

以下是我需要更改的代码部分。第一个td是选择要显示的选项。必须根据第一个选择显示其他td。

<%-- Empresa--%>
    <td>
        <% String onchange = "javascript:buttonUpdateVisibility(" + key + ",this);"; %>
        <select name="<%=contratoTrabajadorTipo%>" onchange="<%=onchange%>">
            <option value="<%=ContratoTrabajador.TIPO_CONTRATO%>"><bean:message key="contrata"/></option>
            <option value="<%=ContratoTrabajador.TIPO_SUBCONTRATA%>"><bean:message key="subcontrata"/></option>
        </select> 
    </td>
    <%-- Subcontrata --%>
    <td>
        <%  
            String keyContrata = key + "_contrata";
            String keySubcontrata = key + "_subcontrata";   
        %>
        <span id="<%=keyContrata%>" style="display: none;"><bean:write name="contratoEntregaForm" property="nombreEmpresa" /></span>
        <html:select styleId="<%=keySubcontrata%>" property="<%=contratoTrabajadorSubcontrata%>" styleClass="campoSelect">
            <html:options collection="<%=WebConstants.LISTA_EMPRESAS_KEY%>" labelProperty="nombreComercial" property="idEmpresa"/>
        </html:select>
    </td>

我正在尝试创建一个用于更新可见性的javascript函数，但我不知道该怎么做。

function buttonUpdateVisibility(key,sel){
    if(sel.value == 'C'){
        document.getElementById(key+"_contrata").style.display = "none";
        document.getElementById(key+"_subcontrata").style.display = "block";
    } else if(sel.value == 'S'){
        document.getElementById(key+"_contrata").style.display = "block";
        document.getElementById(key+"_subcontrata").style.display = "none";
    }
}

也许用jquery可以做到这一点，但我对这门语言知之甚少。谢谢！

Answer 1

试试这个，

function buttonUpdateVisibility(key,sel){
    if(sel.value == 'C'){
        $("#"+key+"_contrata").hide();
        $("#"+key+"_subcontrata").show();
    } else if(sel.value == 'S'){
        $("#"+key+"_contrata").show();
        $("#"+key+"_subcontrata").hide();
    }
}

并调用函数

onchange="javascript:buttonUpdateVisibility('<%=key%>',this); ">
// Use quotes for key ----------------------^--------^

通过选择显示/隐藏动态td

1 个答案: