只有退出父元素後觸發子事件

我在父div內有兩個子輸入。我想在用戶退出父元素時觸發事件，但當用戶從一個孩子直接移動到另一個時，不會觸發事件。在這個例子中，我要求用戶獨立輸入到輸入日期和時間：只有退出父元素後觸發子事件

<div id="form"> 
    <div id="dateTime"> 
    <input id="date"> 
    <input id="time"> 
    </div> 
</div>

我一直在使用「.focusout」和「.blur」沒有成功如下嘗試 - 我的意思的情況下在用戶從「日期」選項卡變爲「時間」時觸發，而不是等待用戶退出「時間」並退出父節點「dateTime」div。

$("#form").on('focusout', '#dateTime', function() { 
    alert ('User has exited the "dateTime" div.'); 
}); 
$("#form").on('blur', '#dateTime', function() { 
    alert ('User has exited the "dateTime" div.'); 
});

我的方法在HTML結構或使用JQuery方面存在問題嗎？

來源

2016-05-17 runner

看看http://stackoverflow.com/a/7385673/5549391 – agDev

感謝。那裏的強有力的討論幫助我理解了傳播的有用性和侷限性。 – runner

它總是'自下而上'讓我改變我的方法來簡單地測試輸入元素是否爲空，然後觸發下一個函數。乾杯 – runner

我沒有嘗試這個，但是我認爲這應該工作

$("#dateTime").focusout(function() { 
    if ($(this).has(document.activeElement).length === 0) { 
    alert('User has exited the "dateTime" div.'); 
    } 
});

來源

2016-05-17 20:51:47 agDev

見上面的評論。 – runner

只有退出父元素後觸發子事件

回答

相關問題