Insertar formulario de respuesta de comentarios en la página usando Jquery

He estado haciendo un sistema de comentarios con hebras como una forma de aprender php y javascript/jquery correctamente. He hecho cosas en el pasado pero he tomado una resolución de año nuevo para aprenderlo correctamente.Insertar formulario de respuesta de comentarios en la página usando Jquery

Tengo problemas para insertar un formulario de respuesta en el árbol de comentarios debajo del comentario al que se responde. Sé que esto es probablemente bastante básico, pero ¿cómo insertar html en una página cuando alguien hace clic en un enlace?

Este código no funcionaba para mí:

$(document).ready(function(){ 
    $(function() { 
     $('a#reply').click(function() { 

      $(this).append("the html blah");  

     }); 
    }); 

});

Cualquier ver donde im que va mal?

Fuente

2009-01-19 Joe

Si ninguna de las otras sugerencias funciona, podría ser que su selector para el enlace no esté funcionando correctamente. En el ejemplo que proporcionó, parece que está buscando un enlace como este:

<a id='reply' href='#'>add comment</a>

¿Es correcto? Usted no ha mencionado cómo se estaban generando el html, pero sé con asp.net el id del lado del servidor = el ID de cliente y lo que se necesita para modificar su selector de modo:!

$('a[id$=reply]')

En cualquier caso , aquí hay un ejemplo completo con html que funciona bien para mí:

<html> 
    <head> 
     <script type="text/javascript" src='scripts\jquery-1.2.6.min.js'></script> 
    </head> 
    <body> 
     <div style='height:400px'> 
      Space to demonstrate that clicking the link does not scroll the page. 
     </div> 
     <div id='main'> 
      <a href='#' id='clicky'>here</a> 
     </div> 
    </body> 
    <script> 
     $(function(){ 
      $('a#clicky').click(function(){ 
       $(this).after('Hello There') 
       return false; 
      }); 
     }); 
    </script> 
</html>

Fuente

2009-01-19 16:01:12

Hola, probé tu código y está funcionando ahora, creo que podría haber sido demasiado de $ (documento) .ready (function() {pero sea lo que sea, has sido de gran ayuda. Gracias. – Joe

Hola otra vez Corey Estaría muy agradecido si me ayudara de nuevo. He descubierto que la función solo insertará html para la primera instancia del ID a # en la página. Como cada comentario tiene un botón de respuesta, este es un gran problema. ¿algunas ideas? – Joe

No es válido html tener múltiples elementos con el mismo ID. Yo recomendaría cambiar ese ID a una clase, y luego modificar su selector en consecuencia $ ('a.className') –

Para añadir a rodbv de respuesta que le añade el texto "el html, bla, bla" dentro el enlace que se hizo clic porque está utilizando append. Cambiarlo a:

$(this).after("the html");

Y va a escribir el html después el enlace en su lugar.

Fuente

2009-01-19 14:47:43 roborourke

Gracias por la sugerencia, todavía no aparece nada en la página. Me redireccionan a la parte superior de la página ya que mis enlaces de anclaje a # () – Joe

agregan un "return false;" al final de tu evento –

$(document).ready(function(){ 
     $('a#reply').click(function() { 
      $(this).after("the html blah"); 
      return false; 
     }); 
});

Es posible que necesite el 'return false;' allí para evitar que la página se vuelva a cargar al hacer clic en el enlace.

Fuente

2009-01-19 14:58:46

Gracias, esto parece tener sentido pero sigo siendo redireccionado a la parte superior de mi página. Mi enlace es solo . – Joe

La vinculación a '#' saltará a la parte superior de la página porque está buscando un anclaje que coincida con ella, en este caso el primer elemento (cuerpo) porque es un ancla en blanco. 'return false' debería eludir eso sin embargo. Puede ayudar a publicar un enlace a una página de prueba o pegar el código HTML también. – roborourke

Gracias por la ayuda de sancho pero Corey encontró el problema en su publicación más abajo en la página – Joe

Insertar formulario de respuesta de comentarios en la página usando Jquery

Respuesta

Cuestiones relacionadas