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

Nip*_*ips 15 jquery

我有功能:

$(document).ready(function(){

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

}
Run Code Online (Sandbox Code Playgroud)

和HTML:

<div class="usil">
    <div class="editable">
        <form>
            <input type="text" class="myclass" />
        </form>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

在加载页面jquery上"myclass"元素工作正常,但其他脚本动态添加"usil"类divs并在此divs jquery不工作.怎么做?

Bla*_*ger 34

使用事件委托:

    $(document).on('focus',"input.myclass", function() {
        // something
    }).on('blur',"input.myclass", function() {
        // something
    });
Run Code Online (Sandbox Code Playgroud)

要么

$(document).on({
    'focus': function () {
        // something
    },
    'blur': function () {
        // something
    }
}, 'input.myclass');
Run Code Online (Sandbox Code Playgroud)

http://api.jquery.com/on

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

  • 应该注意的是,如果可以避免使用"文档"通常不是一个好主意.出于性能原因,您希望使用最接近的公共静态祖先元素. (2认同)