Question

当我失去焦点时，我正在尝试更改输入元素的类。该项目的整个前提是允许用户双击某些文本，然后能够编辑该文本。然后，当他们失去对场地的关注时，看起来它应该不是表格的一部分。

我的问题在于：

$('.actdblclk').dblclick(function(){

    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus();

});

$('.actdblclk_active').focusout(function(){
    alert();

    $(this).removeClass('actdblclk_active').addClass('actdblclk');
});

当我双击时，我会关注输入字段，但是当我点击时，焦点输出事件不会触发。

这是整个小提琴http://www.jsfiddle.net/t8JsG/

Answer 1

focusout（）事件处理程序不会触发，因为在分配时，没有带有类.actdblclk_active的元素。

你应该在dblclick（）中分配一个focusout（）处理程序，如下所示：

$('.actdblclk').dblclick(function(){
  $(this).removeClass('actdblclk').addClass('actdblclk_active').focus();
  $(this).focusout(function(){
    alert();

    $(this).removeClass('actdblclk_active').addClass('actdblclk').unbind('focusout');

  }) 
});

更新：第二个选项是使用jQuery.live（）分配focusout（）处理程序，如下所示：

$('.actdblclk_active').live('focusout', function(
  alert();
  $(this).removeClass('actdblclk_active').addClass('actdblclk');)
});

这样，这个处理程序将被分配给当前和任何与.actdblclk_active选择器匹配的未来元素

Answer 2

您可以将处理程序添加为实时事件处理程序。这样，实时处理程序总是在匹配的选择器中查找事件。

$('.actdblclk').dblclick(function(){

    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus();

});

$('.actdblclk_active').live('focusout', function(){
    $(this).removeClass('actdblclk_active').addClass('actdblclk');
});

Answer 3

页面加载时，页面上没有包含类actdblclk_active的元素。

您应该使用原始类分配focusout处理程序：

$('.actdblclk').dblclick(function(){     
    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus();
}).focusout(function(){
    $(this).removeClass('actdblclk_active').addClass('actdblclk');
});

聚焦或模糊类元素

3 个答案: