JQuery Blur событие запускается несколько раз с динамическим редактированием контента - PullRequest
Новая
       13

JQuery Blur событие запускается несколько раз с динамическим редактированием контента

0 голосов
/ 26 ноября 2011

Когда я нажимаю на элемент div определенного класса, я изменяю contenteditable на true. onblur этого кликаемого div Я хочу, чтобы он что-то предупредил. Первый раз, когда я размываю div, он работает нормально, но после этого он показывает одно и то же предупреждение дважды. Так что в первый раз он предупреждает один раз. Во второй раз он предупреждает дважды и т. Д.

Что я делаю не так? 

content = $('#content');

content.delegate('div', 'click', function(event){
    $(this).attr('contenteditable', 'true');
    $(this).focus();
    $(this).bind('blur', function(){
        alert('blur');
    });
});

Пример: http://jsfiddle.net/W8que/4/

1 Ответ

3 голосов
/ 26 ноября 2011

Вы связываете размытие снова при каждом нажатии. Каждая привязка является новой, и они укладываются. Используйте .delegate() (или .on()) также для функции размытия.

скрипка: http://jsfiddle.net/W8que/11/

код: 

content = $('#content');

content.on('click', 'div', function(){
    $this = $(this);
    $this.attr('contenteditable', 'true');
    $this.focus();
});

content.on('blur', 'div', function(){
  alert('blur');
});

Поскольку скрипка уже использовала jQuery 1.7.x, я пошел дальше и поменял .delegate() на более актуальную .on(). Добавил несколько других вещей, таких как кеширование $(this) и не потрудился передать событие в функцию, так как нам ничего не нужно preventDefault() или stopPropagation().

...