如何在動態插入元素上使用焦點和模糊？

Question

我有功能：

$(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> 

在加載頁面的jQuery的「MyClass的」元素正常工作，但其他腳本動態添加「USIL」類的div並在此div的jQuery的不要工作。怎麼做？

Answer 1

使用事件代表團：

$(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/

Answer 2

該代碼可以幫助：

$('input').live('focus', function() { 
    $('label span').text('focus'); 
}).live('blur', function() { 
    $('label span').text('blur'); 
}); 

用例： http://jsfiddle.net/CPQ37/