Почему скрипт, заменяющий тег по клику, начинает грузить страницу после нескольких вызовов?

Question

[damarkuzz]

Данный скрипт предназначен для визуального редактирования вставленного в textarea текста.

При нажатии на одну из строчек стиха можно редактировать данную строку, клик вне области сохраняет изменения.

Всё успешно работает, но на пятой-восьмой редакции строк по порядку начинает подвисать страница. Подскажите, пожалуйста, что я делаю не так.

Comments

[Сергей Сергей]

Здесь рекурсивно навешиваются обработчики click и mouseup. Нужно вешать единожды.

[damarkuzz]

Сергей Сергей, я пробовал не вкладывать их друг в друга, например

function spanToInput() {
			$('.songText span').click(function(){
				var spanText = $(this).text();
				var spanValue = "<input value='"+spanText+"'>";
				$(this).replaceWith(spanValue);
				var $curentSpan = $('.col-like-ss').find('input[value="'+spanText+'"]');
				$curentSpan.focus().val('').val(spanText);
			});
			$(document).mouseup( function(e){
				var div = $(document).find('.songText input');
				var divVal =  div.val();
				if ( !div.is(e.target)
					&& div.has(e.target).length === 0 ) { 
					var commonVal = div.val();
					var backToP = "<span>"+divVal+"</span>";
					div.replaceWith(backToP);
					spanToInput();
				}
			});
		}

[Сергей Сергей]

Всё равно рекурсия. Функция вешает обработчик, внутри которого её вызывают.