jQuery form .hide()不起作用

jQuery form .hide() not working

本文关键字:不起作用 hide form jQuery      更新时间:2023-09-26

我的HTML中有两个表单

<form id="formRegistroMarcaAtletaDistancia">
    <ul class="form">
        <li> <label>Centimetros:</label><input class="ingresoDatos" name="cmAtl2" id="cmAtl2"  type="number"  min="0" required/></li>
    </ul>
</form>
<form id="formRegistroMarcaAtletaTiempo">
    <ul class="form">
        <li> <label>Minutos:</label><input class="ingresoDatos" name="minutosNat" id="minutosNat"  type="number"  min="0" required/></li>
        <li> <label>Segundos:</label><input class="ingresoDatos" name="segundosNat" id="segundosNat"  type="number"  min="0" required/></li>
    </ul>
</form>

和这个if语句(条件按预期工作,已经测试)在外部文件中。

if(distancia) {
    $("#formRegistroMarcaAtletaTiempo").hide();
    $("#formRegistroMarcaAtletaDistancia").show();
} else {
    $("#formRegistroMarcaAtletaDistancia").hide();
    $("#formRegistroMarcaAtletaTiempo").show();
}

如果条件距离而不是满足,代码按预期工作。

如果满足条件,则显示两种形式。

导致 formregistromarcaatletadistance 总是显示,而formRegistroMarcaAtletaTiempo只在应该显示的时候显示。

我试着改变表格的顺序,像这样

<form id="formRegistroMarcaAtletaTiempo">
    <ul class="form">
        <li> <label>Minutos:</label><input class="ingresoDatos" name="minutosNat" id="minutosNat"  type="number"  min="0" required/></li>
        <li> <label>Segundos:</label><input class="ingresoDatos" name="segundosNat" id="segundosNat"  type="number"  min="0" required/></li>
    </ul>
</form>
<form id="formRegistroMarcaAtletaDistancia">
    <ul class="form">
        <li> <label>Centimetros:</label><input class="ingresoDatos" name="cmAtl2" id="cmAtl2"  type="number"  min="0" required/></li>
    </ul>
</form>

令我惊讶的是,现在formRegistroMarcaAtletaTiempo总是显示,而 formregistromarcaatletadistance 只在应该显示的时候显示。

编辑:整个div

<div id="subpagina5" class="contenedor">
    <h1 class="encabezado">Registro de marca de un atleta en una disciplina</h1>
        <form id="formRegistroMarcaAtleta">
            <ul class="form">
                <li> <label>Disciplina:</label>
                    <select id="listaDisciplinasRegistroMarcaAtleta" class="listaDatos"></select>
                </li>
                <li> <label>Atleta:</label>
                    <select id="listaAtletasRegistroMarcaAtleta" class="listaDatos"></select>
                </li>
            </ul>
            <form id="formRegistroMarcaAtletaTiempo">
                <ul class="form">
                    <li> <label>Minutos:</label><input class="ingresoDatos" name="minutosRMA" id="minutosRMA"  type="number"  min="0" required/></li>
                    <li> <label>Segundos:</label><input class="ingresoDatos" name="segundosRMA" id="segundosRMA"  type="number"  min="0" required/></li>
                </ul>
            </form>
            <form id="formRegistroMarcaAtletaDistancia">
                <ul class="form">
                    <li> <label>Centimetros:</label><input class="ingresoDatos" name="cmRMA" id="cmRMA"  type="number"  min="0" required/></li>
                </ul>
            </form>
            <div class="btnContenedor">
                <input type="submit" value="Aceptar" id="btnRegistroMarcaAtleta" class="btnSubmit" />
            </div>
        </form>
</div>

您已经按照如下方式安排了表单,根据XHTML验证,基本上表单不应该嵌套。一旦你解决了这个问题,你的问题将在你发布的小提琴中进行排序。

希望有帮助

 <form id="formRegistroMarcaAtleta">
..
 <form id="formRegistroMarcaAtletaTiempo"></form>
...
 <form id="formRegistroMarcaAtletaDistancia"></form>
</form>