jQuery: Как вернуть события мыши после unbind?

Question

Мне нужно показать ввод текста, когда мышь вводит элемент TD и скрывается, когда он уходит. Таким образом, когда мы нажимаем на этот ввод (фокус), он отвязывает события мыши ....... что я должен написать, чтобы связать стандартные действия с mouseenter & mouseleave, когда мы нажимаем Enter во вводе?

$(".translation").mouseenter(function(){ 
      $(this).html('<input type="text" class="tr_input" placeholder="Перевести...">'); 


      $(".tr_input").focus(function(){ 
       $(".translation").unbind("mouseenter"); 
       $(".translation").unbind("mouseleave"); 
      }); 

     }); 

     $(".translation").mouseleave(function(){ 
      $(this).html(""); 
     }); 

Answer 1

Вместо того, чтобы воссоздать на вход каждый раз, когда я думаю, что вы можете создать его один раз (может быть, прямо в HTML), но с display:none. Когда мышь входит в ваш td, спрячьте все, что там, и покажите свой вход.

Затем, когда мышь покидает ваш вход, вы снова скрываете его и показываете, что было раньше (если есть). Таким образом вам не нужно будет связывать и развязывать элементы «на лету».

Обновление: Я думаю, что неправильно понял ваш вопрос. Может быть, кто-то еще знает, как правильно привязывать и отвязывать обработчики событий (я этого не делаю), но, возможно, я могу помочь вам решить вашу проблему. Если я правильно понял, вы пытаетесь сделать что-то подобное редактированию содержимого таблицы, верно? (например, электронная таблица)

Итак, мое предложение выше все еще применяется, однако вы хотите, чтобы эти обработчики не запускались после того, как пользователь нажал на вход. Поскольку только один элемент будет иметь фокус в то время, вы можете создать lock переменную и установить его на истинный, когда пользователь редактирует его:

var lock = false; 
$("input").click(function() { lock = true; }); 

И тест для этого перед запуском каждого из обработчиков:

$(".translation").mouseenter(function(){ 
    if (lock) 
     return; 

Когда пользователь нажимает кнопку ввода (или вход теряет фокус), вы можете снова установить lock = false и запустить тот же код, что и для mouseleave (поскольку мышь могла уже уйти, пока пользователь редактировал).

Полный рабочий пример: jsFiddle. Надеюсь, поможет!