Question

我很久以前就知道，对于动态添加的内容，必须使用$(document).on('click','[ID]', function(){}); ....等来附加侦听器和点击和焦点等事件。

但是，我要做的是更改已动态添加的特定元素的HTML值。

例如，我使用此代码添加元素：

$('.friend_chooser_pop').html("<div id='#friend_chooser_list'></div>");

现在如何访问#friend_chooser_list并设置其HTML值？这些都不起作用：

$('#friend_chooser_list').html('something');
document.getElementById('friend_chooser_list').innerHTML = 'something';

Answer 1

这应该可行，您的问题是您在自己的ID中加了#，这里不需要。

这样可行。

$('.friend_chooser_pop').html("<div id='friend_chooser_list'></div>");
$('#friend_chooser_list').html('something');

如果您打算在ID中加入#并希望它能够正常使用，您可以像这样使用它：

$("#\\#friend_chooser_list").html('something');

它正在逃避#并允许jQuery无论如何都能获得正确的元素。我不推荐这个，它可以很快混淆。

Answer 2

当您向页面动态添加元素时，您必须刷新事件侦听器。

您应该将所有事件侦听器分组到一个函数中：

function bindEvents(){
    $('*').off();

    $('a.fonction').click(function(){
        /* ... */
    }
}

第一行（.off（））删除页面上的所有侦听器（* =所有元素，就像在CSS中一样）。

然后在更改页面内容时调用此函数。

玩得开心！

Answer 3

$('.friend_chooser_pop #friend_chooser_list').html('something');

您可以为其提供父上下文并将$('.friend_chooser_pop').html("<div id='#friend_chooser_list'></div>");更改为$('.friend_chooser_pop').html("<div id='friend_chooser_list'></div>");，以便在DOM中显示jQuery

如何在Jquery中更改动态生成的元素的HTML内容

3 个答案: