Hola a todos tengo el siguiente problema, estoy creando una tabla y para agregarle las filas lo hago dinamicamente en dicha tabla,es decir creo campos de tetos editables y un boton para agregar la fila, hasta ahi todo bien el problema esta cuando le doy al boton editar la fila q la edito y le voy a dar clic al boton agregar este no hace nada, pierde el evento clic que le cree a dicho boton. si alguien pudiera ayudarme lo agradecería.
entre Desarrolladores
Recibe ayuda de expertos
Registrate y pregunta
Es gratis y fácil
Recibe respuestas
Respuestas, votos y comentarios
Vota y selecciona respuestas
Recibe puntos, vota y da la solución
Pregunta
4 Respuestas
Normalmente jQuery asocia los eventos al terminar la carga de la página (el document.ready ).
Si creas elementos nuevos después de ejecutar el document.ready estos no tendrán los eventos asociados. Tendrás que asociarlos de nuevo.
Ejemplo, si tienes este código:
$(document).ready(function() {
$('.boton').click( function(){
//hacer algo
});
$('.boton2').click( function(){
//Crear un elemento del tipo .boton
});
};El elemento .boton que creas en la segunda función no tendrá asociado el efecto del clic declarado antes. Así que tendrías que tener algo así:
$(document).ready(function() {
$('.boton').click( function(){
miFuncion();
});
$('.boton2').click( function(){
var nuevoBoton = crearNuevoBoton();
nuevoBoton.click( function(){ miFuncion } );
});
};Supongo que tu problema irá en esta linea.
Hola, te paso un código de un ejercicio que hice para poner en práctica JQuery, consiste en crear una tabla donde le indicas el número de filas y columnas y le pones colores a las filas pares e impares, no tiene función de agregar, es decir, cada vez que cambies los valores lo que hace es eliminar la tabla existente y crear la nueva, aunque la función agregar se la podrías crear modificando el código es bien fácil, no obstante si te atrancas pregunta igualmente. Incluyo HTML, CSS y JQuery.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title> Ejercicio3</title>
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script src="jquery.js" type="text/javascript"></script>
<link href="EstiloEjercicio2.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="titulo">
Ejercicio3
<hr size=3 id="linea" color=#ABC9>
</div>
<div id=Formulario>
<div>
<label for=filas>Filas:</label>
<input type="number" id="filas" min=1 max=10>
</div>
<div>
<label for=columnas>Columnas:</label>
<input type="number" id="columnas" min=1 max=10>
</div>
<div>
<label for="colorPares">Color Filas Pares:</label>
<input type="color" id="colorPares">
</div>
<div>
<label for="colorImpares">Color Filas Impares</label>
<input type="color" id="colorImpares">
</div>
<div>
<input type="button" id="aceptar" value="aceptar">
</div>
</div>
<div id="tabla">
</div>
</body>
</html>
/* CSS Document */
body{
background-color:#fff6f1;
font-family:"Helvetica Arial";
width:960px;
}
#titulo {
color:#990099;
font-size:2em;
font-weight:bold;
text-align:center;
}
#linea{
color:#990099;
}
div {
margin: .4em 0;
}
div label {
width: 15%;
float: left;
}
.estiloTabla {
border-width:1px;
border-style: solid;
}
td {
width: 30px;
height:20px;
margin: 0px;
padding: 0px;
}
ol li{
list-style:none;
}
$(document).ready(function(){
$("#aceptar").click(crear);
function crear(){
var colorPar = $("#colorPares").val();
var colorImpar = $("#colorImpares").val();
var filas = $("#filas").val();
var columnas = $("#columnas").val();
if (colorPar == "" || colorImpar == "" || filas == "" || columnas == "") {
window.alert("No puede estar ningun campo sin valor");
}else{
$("table").remove();
$("#tabla").append("<table></table>");
for (var f = 0; f < filas; f++) {
$("table").append("<tr></tr>");
for(var c=0; c < columnas; c++){
if (f%2==0) {
$("tr:last-child").append("<td></td>");
$("tr:last-child td:last-child").css("background-color", colorImpar);
}else{
$("tr:last-child").append("<td></td>");
$("tr:last-child td:last-child").css("background-color", colorPar);
}
}
};
}
}
});El problema es sencillo, si tu tienes un boton con una id, y llamas al evento click de ese boton, funciona, pero... si tienes un evento para un botón que no existe al iniciar la página y lo creas luego dinámicamente.... este no funciona, en la función en la que vuelves visible el botón, o haces aparecer el botón debes tambien meter el capturador de evento onclick, para que funcione correctamente, si no, estas creando un listener para un evento, que apunta a un elemento que no existe con lo cual ya no funcionará.
Por favor, accede o regístrate para responder a esta pregunta.
Actividad Reciente
alyvrs preguntó Oct 19
Ayuda , necesito mostrar datos creados solo por el…ManHol preguntó Jul 9
pasar un archivo de excel a csv en pythonArtEze respondió Abr 24
Alguien sabe, no me ignorenArtEze seleccionó una respuesta Abr 24
Bajar extensión de Chrome sin actualizar el navega…ArtEze respondió Abr 24
Bajar extensión de Chrome sin actualizar el navega…ArtEze preguntó Abr 24
Bajar extensión de Chrome sin actualizar el navega…ArtEze respondió Abr 24
No me deja instalar OracleArtEze respondió Abr 24
Formulario que guarde los datos de un jsonArtEze comentó Abr 24
Script /boot/ scrapingSantiago2610 comentó Mar 23
Acualizar ChoiceField en django
Ultimas Preguntas
Usuarios Top
- Leonardo-Tadei
- 227320 Puntos
- Peter
- 150480 Puntos
- white
- 75880 Puntos
- carlossevi
- 63580 Puntos
- magarzon
- 30650 Puntos
- pregunton
- 20400 Puntos