为什么当我在页面顶部滚动并单击附加表格的链接时，它会向下滚动

Question

i have a page that show activity feeds with a comment link for each feed, i add a comment form dynamically like this :

$("#feedList").on("click", ".comment-link", function(e){
        $(this).parent().append('<form method="post" action="#" class="commentForm"><p><textarea class="comment"></textarea></p><p><input type="submit" value="add" class="send-Comment-Btn" /></p></form>');
        $("textarea.comment").select();
        return false;
    }); 

when i scroll down my page and i click in some comment link it shows me the form as expected, but if i scroll to the top of the page again and i try to click a comment link it shows the form too but it scroll me to the bottom page to the last link i have clicked before, someone can tell me why this behavior and solution for this ?

Answer 1

$("textarea.comment").select();

will always move you to first created textarea element with class "comment". Maybe you must add some ID that increments every click like:

var someID = 0;
$("#feedList").on("click", ".comment-link", function(e){
someID += 1;
        $(this).parent().append('<form method="post" action="#" class="commentForm"><p><textarea class="comment" id="selectorForComment' + someID + '"></textarea></p><p><input type="submit" value="add" class="send-Comment-Btn" /></p></form>');
        $("#selectorForComment" + someID).select();
        return false;
    });