jquery - 如何在动态插入元素上使用焦点和模糊？

Question

这个问题已经有答案了:

Event handler not working on dynamic content [duplicate] (2 个回答)

已关闭 9 年前。

我有功能:

$(document).ready(function(){

    $("input.myclass").focus(function() {
        // something
    }).blur(function() {
        // something
    });

}

和 html:

<div class="usil">
    <div class="editable">
        <form>
            <input type="text" class="myclass" />
        </form>
    </div>
</div>

在加载页面上，“myclass”元素上的 jquery 工作正常，但其他脚本动态添加“usil”类 div，并且在此 div 上 jquery 不起作用。怎么做？

Answer 1

使用事件委托(delegate):

    $(document).on('focus',"input.myclass", function() {
        // something
    }).on('blur',"input.myclass", function() {
        // something
    });

或

$(document).on({
    'focus': function () {
        // something
    },
    'blur': function () {
        // something
    }
}, 'input.myclass');

http://api.jquery.com/on

http://learn.jquery.com/events/event-delegation/