Почему функция отрабатывает 2 раза вместо одного?

Question

[kuznetsovin]

Доброго времени суток. У меня есть некоторый код на js:

function send_comment(idpost, btn){
	commentid = $(btn).parent().children("#commentid").val();
	text = $("textarea[name='text']").val();
    key = $("input[name='csrfmiddlewaretoken']").val();
	$.post('/addcomment',
		{
		post: idpost,
		comment: text,
		parentid: commentid,
		csrfmiddlewaretoken: key
		},
        function (data) {
            $("textarea[name='text']").val('');          
            $('#add_comment').appendTo('.comment_div').addClass('hidden');
            $('.comment').remove();
            $.each(data, function(index, comment){
                    $('#print_comment_block').append(print_comment(idpost, comment))
                    }               
                )//*/
            },
        'json')
	return false
	} 
    
function add_new_comment(postid, href){
    var comment = $(href).parent().attr("id");
    if (comment) {
		$frm = $('#add_comment').removeClass('hidden');
		$('<input/>').appendTo($frm).attr({'type':'hidden','id':'commentid'}).val(comment); 
        $frm.appendTo($('#' + comment + '> .reply_form'));
        $('#' + comment + '> a.reply').addClass('hidden');
		} 
	else {
		$('#add_comment').removeClass('hidden');
        $('.comment_div > a').addClass('hidden');
		}
        
    $("input[name='save']").click(function () {return send_comment(postid,  this)});  
    return false;
	}

function print_comment(post, rqst){
    $cmt = $('<div/>').addClass('comment').css('margin-left',rqst.level*10).attr('id', rqst.id)
    $cmt.attr('id', 'comment_'+rqst.id);
	$('<input/>').appendTo($cmt).attr({'type':'hidden','id':'commentid'}).val(rqst.id);    
    $('<div/>').appendTo($cmt).addClass('username').text(rqst.username);
    $('<div/>').appendTo($cmt).addClass('comment_text').html(rqst.text);			
    $vocing = $('<div/>').attr('id','voicing');    
    $a = $('<a/>').addClass('plus')
    $a.click(function () {return voicing({voice:1, comment_id: rqst.id})})
    $vocing.append($a);
    $rating = $('<div/>').addClass('rating').attr('id','rating_comment_'+rqst.id).text(rqst.rating);
    if (parseInt(rqst.rating) > 0)  $rating.addClass('positive');
    if (parseInt(rqst.rating) < 0)  $rating.addClass('negative');       
    $rating.appendTo($vocing)
    $a = $('<a/>').addClass('minus');
    $a.attr({'href':'#voice', 'title':'Не нравится'});
    $a.click(function () {return voicing({voice:-1, comment_id: rqst.id})})
    $vocing.append($a);
    $cmt.append($vocing);
    $cmt.append('&#149;')
    $a = $('<a/>').addClass('reply');
    $a.click(function () {return add_new_comment(post, this)});
    $a.text('Ответить'); 
    $cmt.append($a)
    $('<div/>').appendTo($cmt).addClass('reply_form')
    return $cmt
    }

Данный код переформировывает дерево комментариев. Проблема в следуещем: при закгрузке страницы код отрабатывает как надо, но после переформирования функция send_comment() срабатывает 2 раза и поэтому нужная инфа задваивается. Подскажите пожалуйста в чем может быть ошибка может быть я не так привязываю событие click() у динамической ссылки?

Answer 1

[Александр Хиренко]

не используйте click, вынесите событие в $(document).ready(function(){}); и там используйте

$(document).on('click', '#my-button', function(e){
    e.preventDefault();
    ...
});

или же перед вызовом убивайте ранее навешанные события с помощью die('click')

Comments

[Сергей Протько]

вешать делегат на document плохая практика между прочим. Делегаты стоит вешать на контейнеры, в которых у вас динамически появляются элементы.

[Александр Хиренко]

@Fesor верно, извиняюсь, это просто для примера

Answer 2

[Сергей Протько]

Это вообще нормально что у вас в функции print_comment два раза навешивается обработчик? Вообще по вашему трешокоду я бы посоветовал его переписать. Может и ошибку найдете.