Question

我有一个表有3个选择，两个是隐藏的，一个在开头，根据选择出现一个或另一个，我用a。 js调用操作来创建表的新行，也使用会计将其添加到select的id并避免相同的调用，问题是当我创建新行而不是更改请求时不会标记bug什么也没做这是我的代码

code html

 <script>    
    $(document).ready(function () {
        $("#estado").change(function () {
            if ($("#estado").val() == 2) {
                $("#sino").show();
                $("#sexo").hide();            
            }
            if ($("#estado").val() == 3) {
                $("#sino").hide();
                $("#sexo").show();
            }
    </script>
    <td>
    <select id="estado">
    <option value="1">Seleccione 1 opcion</option>
    <option value="2">Laboratorio</option>
    <option value="3">Datos Generales</option>
    </select>
    </td>
    //laboratorio
    <select name="sino" id="sino"style="display:none">
    <option value="1">Si </option>
    <option value="2">No</option>
    </select>
    datos generales
    <select name="sexo" id="sexo"  style="display:none">
    <option value="1">Masculino </option>
    <option value="2">Femenino</option>
    </select>

codigo .js

//manipulacion 
var cont=1
    $(document).ready(function () {
        $("#estado"+cont).change(function () {      
            if ($("#estado"+cont).val() == 2) {
                $("#sino"+cont).show();
                $("#sexo"+cont).hide();       
            }
            if ($("#estado"+cont).val() == 3) {
                $("#sino"+cont).hide();
                $("#sexo"+cont).show();
            } );
            var strNueva_Fila = '<tr>' +
'<td><label>Area Medica</label></td>' +
'<td><select id="estado' + cont +'"><option value="1">Seleccione 1 opcion</option><option value="2">Laboratorio</option><option value="3">Datos Generales</option><select></td>' +
'<td><select name="sino" id="sino'+cont'"style="display:none"><option value="1">Si </option><option value="2">No</option></select></td>' +
'<td id="columna1' + cont + '" ><select name="sexo'+cont'" id="sexo"  style="display:none"><option value="1">Masculino </option><option value="2">Femenino</option></select>'+
'<td><input type="button" value="+" class="clsAgregarFila"><input type="button" value="-" class="clsEliminarFila"></td>' +
'</tr>';
        cont++;
        var objTabla = $(this).parents().get(3);     
        $(objTabla).find('tbody').append(strNueva_Fila);      
        if (!$(objTabla).find('tbody').is(':visible')) {          
          $(objTabla).find('caption').click();
        }
    });
    $(document).on('click', '.clsEliminarFila', function () {     
       var objCuerpo = $(this).parents().get(2);
        if ($(objCuerpo).find('tr').length == 1) {
            if (!confirm('Esta es el única fila de la lista ¿Desea eliminarla?')) {
                return;
            }
        }      
        var objFila = $(this).parents().get(1);      
        $(objFila).remove();
    });
            );

Answer 1

看这里的完整代码就像html一样。 js只是一个复制和粘贴的问题，如果我理解我正在尝试做的是当一个新的行格式化我作为第一个进行更改时，如果你意识到，当你添加一行而什么都不做的时候。

HTML

<html>
<head>
</head>
<body>
<script type="text/javascript" src="jss/jquery-1.9.0.min.js"></script>
    <script type="text/javascript" src="manipulacion.js"></script>
<script>    
    $(document).ready(function () {
        $("#estado").change(function () {
            if ($("#estado").val() == 2) {
                $("#sino").show();
                $("#sexo").hide();            
            }
            if ($("#estado").val() == 3) {
                $("#sino").hide();
                $("#sexo").show();
            }
            });
            });
    </script>
    <table>
    <tr>
    <td>
    <select id="estado">
    <option value="1">Seleccione 1 opcion</option>
    <option value="2">Laboratorio</option>
    <option value="3">Datos Generales</option>
    </select>
    </td>
    <td>
    <!-- //laboratorio -->
    <select name="sino" id="sino"style="display:none">
    <option value="1">Si </option>
    <option value="2">No</option>
    </select>
    </td>
    <td>
    <!-- //datos generales -->
    <select name="sexo" id="sexo"  style="display:none">
    <option value="1">Masculino </option>
    <option value="2">Femenino</option>
    </select>
    </td>
    <td><input type="button" value="+" class="clsAgregarFila"></td>
    </tr>
    </table>
    </body>
    </html>

manipulacion.js

//manipulacion 
var contLin=1
    $(document).ready(function () {
        $("#estado"+contLin).change(function () {      
            if ($("#estado"+contLin).val() == 2) {
                $("#sino"+contLin).show();
                $("#sexo"+contLin).hide();       
            }
            if ($("#estado"+contLin).val() == 3) {
                $("#sino"+contLin).hide();
                $("#sexo"+contLin).show();
            }
}           );



});


$(document).ready(function(){
    //evento que se dispara al hacer clic en el boton para agregar una nueva fila
    $(document).on('click','.clsAgregarFila',function(){
        //almacenamos en una variable todo el contenido de la nueva fila que deseamos
        //agregar. pueden incluirse id's, nombres y cualquier tag... sigue siendo html

        var strNueva_Fila='<tr>'+
'<td><select id="estado'+contLin+'"><option value="1">Seleccione 1 opcion</option><option value="2">Laboratorio</option><option value="3">Datos Generales</option></select></td>' +
'<td><select name="sino'+contLin+'" id="sino"style="display:none"><option value="1">Si </option><option value="2">No</option></select></td>'+
'<td> <select name="sexo'+contLin+'" id="sexo"  style="display:none"><option value="1">Masculino </option><option value="2">Femenino</option></select><td>'+
'<td><input type="button" value="+" class="clsAgregarFila"><input type="button" value="-" class="clsEliminarFila"></td>'+
'</tr>';

contLin++;

        var objTabla=$(this).parents().get(3);


        $(objTabla).find('tbody').append(strNueva_Fila);


        if(!$(objTabla).find('tbody').is(':visible')){

            $(objTabla).find('caption').click();
        }
    });


    $(document).on('click','.clsEliminarFila',function(){

        var objCuerpo=$(this).parents().get(2);
            if($(objCuerpo).find('tr').length==1){
                if(!confirm('Esta es el única fila de la lista ¿Desea eliminarla?')){
                    return;
                }
            }


        var objFila=$(this).parents().get(1);

            $(objFila).remove();
    });



});

jquery隐藏和显示错误

1 个答案: