组类成员的形式元素事件的内容（）

Question

我试图创建一个触发时，任何一类元素失去焦点的功能：

<h5>ON Time</h5> 
<div class = 'timeSetting'><form id = 'weekendStart'> 
<input type='number' inputmode= 'numeric' pattern='[0-9]*' id = 'onHour' value='6' name = 'value' min='1' max='12'><input type='number' inputmode= 'numeric' pattern='[0-9]*' id = 'onMinute' value='30' name = 'value' min='0' max='59'> 
<select id = 'weekendStartAmPm'> 
<option value = 'weekendStartAm'>am</option> 
<option value='weekendStartPm'>pm</option> 
</select> 
</form></div> 
<h5>OFF Time</h5> 
<div class = 'timeSetting'><form> 
<input type='number' inputmode= 'numeric' pattern='[0-9]*' id = 'onHour' value='10' name = 'value' min='1' max='12'><input type='number' inputmode= 'numeric' pattern='[0-9]*' id = 'onMinute' value='00' name = 'value' min='0' max='59'> 
<select id = 'weekdayStartAmPm'> 
<option value='wkdayStartPm'>pm</option> 
<option value = 'wkdayStartAm'>am</option> 
</select> 
</form></div> 

我知道这是不对的，但我想类似的东西：

$('.timeSetting').focusout(function(){ 
    console.log('lost focus'); 
}); 

，其中用户可以表单元素和编辑转移焦点之间，一旦失去类重点任何（和所有）的成员，则函数火灾标签...

Answer 1

下面是一个例子基础上的东西，我写了几年前在SO中处理焦点组：http://jsfiddle.net/TrueBlueAussie/0y2dvxpf/6/

$('div.timeSetting').on('focus focusin', 'input,select', function() { 
    var $editor = $(this).closest('.timeSetting'); 
    $editor.addClass("focused"); 

}).on('blur focusout','input,select', function() { 
    var $editor = $(this).closest('.timeSetting'); 
    // wait for the new element to be focused 
    setTimeout(function() { 
    // See if the new focused element is in the editor 
    if (!$.contains($editor[0], document.activeElement)) { 
     $editor.removeClass("focused"); 
    } 
    }, 0); 
}); 

现在它只是说明了类变化的焦点，但是你可以很容易触发自定义事件，并抓住祖先的人。

Answer 2

试试这个：

$("[class] input").focusout(function(){ 
    console.log('lost focus'); 
}); 

这将选择任何具有class属性设置为任何值的元素中存在的任何输入。

空字符串：

如果ATTR必须存在&可以有任意数值（或根本没有）

jQuery("[href]"); 

编辑：但是，如果你要检测的时刻焦点从class1的div到class2的另一个div，您可以使用以下代码：

var currentClass = false; 
var leftClass = false; 
$("[class]").focusout(function(){ 
    leftClass = $(this).attr('class'); 
    console.log('lost focus ' + leftClass); 
}); 

$("[class]").focusin(function(){ 
    currentClass = $(this).attr('class'); 

    if(leftClass && leftClass != currentClass) { 
     // Put your code here 
     console.log(" div left " + leftClass); 
    } 
    console.log('in focus ' + currentClass); 
});