添加onClick事件以追加()

时间:2015-04-19 09:48:48

标签: javascript jquery html

我正在动态创建一个div。我想向它添加一个onClick()事件。

如何在<div class="something" id="btnHome" onClick="return true">中添加onClick?

abc.append(
    $('<div />', { class: 'something', id: 'btnHome' })
); 

修改

我正在寻找像这样的答案

$('<div />', { class: 'something', id: 'btnHome' onClick: 'return true' })

3 个答案:

答案 0 :(得分:10)

使用event delegation

  

事件委托允许我们将单个事件侦听器附加到父元素,该元素将为匹配选择器的所有后代触发,无论这些后代现在是存在还是将来添加。

对于动态添加的元素,使用parent将事件添加到添加的元素中。

$(staticParentSelector).on('click', '.something', function () {
    // Event Handler Code here
});

您也可以使用document,但这会降低性能

$(document).on('click', '.something', function () {
    // Event Handler Code here
});

查看on

的jQuery文档

答案 1 :(得分:7)

事件委托是正确的方式,@ Tushar为您提供答案。但是,如果你喜欢这样的事情:

$('<div />', { class: 'something', id: 'btnHome' onClick: 'return true' })

然后,您可以这样做:

$('<div/>', { 
    'text': 'new',
    'class': 'something',
    'id': 'btnHome'
}).on({
    'click': function() { alert ("clicked") }
});

演示@ Fiddle

正如squint在以下评论中提到的那样,您也可以使用click作为属性,就像textid一样。

$('<div/>', { 
    'text': 'new',
    'class': 'something',
    'id': 'btnHome',
    'click': function() { alert ("clicked") }
});

答案 2 :(得分:0)

您可以使用委派事件,因此添加到您的jquery代码:

$(document).on('click','#btnhome',function(){'do something here'});

您可以使用文档或DOM中已有的任何其他父元素