JQuery: содержимое элемента восстановления при нажатии за его пределами

Question

В SO есть много вопросов, которые затрагивают проблему обнаружения кликов за пределами назначенного элемента. Однако ни один из них, похоже, не служит моей цели в этом сценарии. Вот функция:

function rateit(){ 
    var cell = $('td.ratingcell'); 
    cell.dblclick(function(e){ 
     e.preventDefault(); 
     var oldhtml = $(this).html();// restore this when clicked outside the cell 
     var oldratingval = parseFloat($(this).find('span.ratingval:first').text(), 10); 
     var oldratingcount = parseFloat($(this).find('span.ratingcount:first').text(), 10); 
     var blanks = '<span id="5">☆</span><span id="4">☆</span><span id="3">☆</span><span id="2">☆</span><span id="1">☆</span>'; 
     $(this).addClass('editablerating'); 
     $(this).html("<span id='editrating'>" + blanks + "</span>"); 
     var clickedstar = $('#editrating span'); 
     clickedstar.click(function(f){ 
      f.preventDefault(); 
      var newrating = parseFloat($(this).attr('id'), 10); 
      var deckid = $(this).parent().parent().parent().find('td.ftable-deck-name:first').find('span.deck_id:first').text(); 
      updaterating(deckid, newrating, this); 
     }); 
    }); 
} 

В основном, эта функция делает ячейку таблицы редактируемой для пользователя, чтобы обновить информацию о инлайн. Он отлично работает, когда пользователь что-то обновляет. Однако мне также нужно обрабатывать ситуации, когда пользователь дважды щелкает ячейку (элемент, на который ссылается var cell в функции выше) для редактирования, но затем щелкает в другом месте (вне ячейки) без какого-либо обновления или нажимает клавишу Esc. Когда это произойдет, мне нужно восстановить содержимое cell до var oldhtml.

Почти все ответы, которые я нашел на SO упоминание, определяющие глобальный обработчик кликов, привязанный к тегу body. Но если я это сделаю, как передать значение oldhtml этому обработчику, который, очевидно, будет находиться вне функции выше?

Answer 1

Вы можете искал много, но это какой-то, как относится к логике, что, почему вы не получили никакого ответа на него, вы можете попробовать использовать data() как,

..... 
    e.preventDefault(); 
    $('table#tableId').data('oldhtml',$(this).html()); // restore this when clicked outside the cell 
..... 

Теперь при нажатии вне клетки вы должны получить oldhtml из таблицы идентификатора как,

$(document).on('click',function(e){ 
    var $elem = $(e.target); 

    if((!$elem.hasClass('ratingcell') && // if it is not the td itself 
      !$elem.closest('td').hasClass('ratingcell')))// and not its content 
    { 
     $td=$(elem).hasClass('ratingcell') ? $elem : $elem.closest('td.ratingcell'); // get the td 
     if($('table#tableId').data('oldhtml')){ 
      $td.html($('table#tableId').data('oldhtml'));// set old content 
     } 
    } 
});