javascript - 事件绑定到动态创建的元素

Question

我有一个文本框#search_text。在 keyup 上，我创建了一个 div#sresult_container。并将某些 div 附加到 div#sresult_container。当此容器显示在画布上时，我尝试将单击和鼠标悬停事件绑定到 div#sresult_container。我尝试以下代码，但那不起作用。我该怎么办？

$("#search_text").keyup(function(e) {
    if (e.which != 40 && e.which != 38) {
        $("#search").removeAttr('disabled');
        $.post('http://www.allinone.com', {
            Search: sVal
        }, function(data) {
            $sresult_container = $('<div id="sresult_container"></div>');
            //somecode which create another divs and append to the $sresult_container
        })
    }

    $('#sresult_container').bind({
        click: function(e) {
            //some code  
            },
            mouseover: function(e) {
                //some code
            }
        });
    });

Answer 1

$('#someParent').on('click', '.someChildSelector', function(e){
});

侦听click冒泡到#someParent匹配指定（即.someChildSelector）选择器的事件。

因此，源自您附加的任何子元素的事件将被上述处理程序捕获。

Answer 2

您可以使用“实时”功能完成此任务。

$('#sresult_container').live('click', function() {
    alert('hello from binded function call');
});