Request jquery giving error

Question

personal I am with the following problem I have a page where you put the comments everything right there loads up to 5 comments so far everything works out what occurs is that in these 5 comments has a button that you click and appears in fadein the field for by reply so far all right, but when I click to show more comments he Ask from another page and those that comes when it is clicked on answer does not work I do not know why.

source code:

javascript

$('.resposta').click(function(){
        var id = $(this).children('input').val();
        alert(id);
        $(this).fadeOut("fast");
        $(this).parents('.coment').find('.resp').fadeIn("slow");

        $('form[name="responder"]').submit(function(){
           return false; 
        });

        return false;
    });

php page where already displays the 5 comments

<?php 
                       /*
                     **********************************************
                     **********************************************
                     ***********Função para exibição dos***********
                     ****************comentarios*******************
                     **********************************************/

                        $comentar = new Read;
                  $comentar ->ExeRead('coment', 'WHERE video = :video ORDER BY id DESC LIMIT 5', "video={$sei[1]}");
                  foreach ($comentar->getResult() as $big):
                      extract($big);
                  $image = new Read;
                  $image ->ExeRead('users', 'WHERE id = :id', "id={$big['user']}");
                  foreach ($image->getResult() as $imx)
                      extract ($imx);
                /*
                     **********************************************
                     **********************************************
                     *********Fim da função de exibição************
                     ***************de comentarios*****************
                     **********************************************/
                  echo "<input type='text' hidden='hidden' value='{$link}' id='link'>";
                  ?>
                    <div class='comentar  fl-left'>
                        <div class='coment com' >

                                <?php 

                    if($foto == "" || $foto == "uploads/"):
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='".REQUIRE_PATH."/css/boot/icons/thumb.png'></a>";
                    else:
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='{$imx['foto']}'></a>";
                    endif;
                    ?>
                   <p><small class='fontze1'>Comentado por:</small> <?=$nome?> <small>Em:  </small> <?=$date?> <small>As: </small> <?=$hora?></p>

                   <div class="comentando">
                       <p><?=nl2br($comentario)?></p></div>
                       <div class='fl-right resposta'>Responder<input type='hidden' value='<?=$big[id] ?>' name='idcoment'>
                       </div>
                       <div class=' resp' style='display:none'>
                           <form method='post'><textarea></textarea>  

                               <input class='btn btn-green' type='submit' value='responder' name='responder'>
                           </form>
                       </div>
                   </div>


                        <?php
                    endforeach;    

                    endforeach;

                    endforeach; 
                    ?>
                    <center><div id='load' class='btn btn-blue btn-full'>Mostar mais comentários</div></center> <div class='clear'></div>
                  </div>

page where is puchado the show more

<?php
include '../_app/Config.inc.php';

// Função do jquery para listar os comentários
if(filter_input(INPUT_POST, 'acao') ==  'comentarios'){

    $video = filter_input(INPUT_POST, 'video');
    $numcom = filter_input(INPUT_POST, 'numcom');

    $readCount = new Read ();
    $readCount ->ExeRead('coment', "WHERE video = :video LIMIT $numcom,4", "video={$video}");

    echo $readCount->getRowCount();

}

// Função do jquery para exibir mais comentários

if(filter_input(INPUT_POST, 'acao') ==  'morecoment'){
    $video = filter_input(INPUT_POST, 'video');
    $numcom = filter_input(INPUT_POST, 'numcom');

    $readCount = new Read ();

    $readCount ->FullRead("SELECT * FROM coment WHERE video = :video ORDER BY id DESC LIMIT $numcom,3", "video={$video}" );


        foreach ($readCount->getResult() as $cat):
        extract($cat);
        $image = new Read;
                  $image ->ExeRead('users', 'WHERE id = :id', "id={$cat['user']}");

                  foreach ($image->getResult() as $imx):
                      extract ($imx);
                  echo "<div class='coment com' style='display:none'>";
                    if($foto == "" || $foto == "uploads/"):
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='".REQUIRE_PATH."/css/boot/icons/thumb.png'></a>";
                    else:
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='{$imx['foto']}'></a>";
                    endif;
                       ?>
                       <p><small class='fontze1'>Comentado por:</small> <?=$nome?> <small>Em:  </small> <?=$date?> <small>As: </small> <?=$hora?></p>

                                <div class="comentando">
                       <p><?=nl2br($comentario)?></p></div>
                       <div class='fl-right resposta'>Responder<input type='hidden' value='<?=$big[id] ?>' name='idcoment'>
                       </div>
                       <div class=' resp' style='display:none'>
                           <form name='responder' method='post'><textarea></textarea>  

                               <input class='btn btn-green' type='button' value='responder' name='responder'>
                           </form>
                       </div></div>

                        <?php


                   endforeach;           
               endforeach;           
}

Answer 1

When you run jQuery there at the beginning, it finds all Divs with "response" class and applies the events you programmed into the response function, right?

Only when you upload more comments, it doesn’t do it again, because it already did once (in the first 5 comments that were already on the page).

That is: you need to run this script in the new answers.

But there’s a problem

If you run that same selector, it will put two events in the first five comments, because jQuery uses the setEventListener to register the click event. That is, it will run twice and occupy more memory for no reason, and it may give you a headache later. To solve this, create a function that does two things: remove all the events from the objects and then put again.

function addEventosRespostas() {
   $('.resposta')
       .off("click")
       .on("click", function(){
         ...
       });
}

Something else Avoid using .click() why he is about to leave the most current jQuery (he must have left already, there is time I hear it). The standard nowadays is .on()

References

http://api.jquery.com/off/

http://api.jquery.com/on/