【发布时间】：2013-02-22 08:27:53
【问题描述】：
当我选择第一个选项时，我有 3 个选择，其中两个隐藏，一个可见，当您按下一个选项时，另一个选项显示第二个选项。所有这些都在一个表中，并使用 jquery 在 manipulacion.js 文件中创建一个新的行按钮一个计数器，我已将它添加到每个选择的 id 中，而不仅仅是调用。错误是当我创建一个新行而不更改我时，我打开控制台并且不检查任何错误。 在这里，我在 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();
});
});
【问题讨论】：
标签： javascript jquery html