对动态添加的元素调用函数

Call function on dynamically added elements

本文关键字：调用 函数 元素 动态 添加      更新时间：2024-01-10

我对javascript和jquery很陌生，所以这可能是一个非常简单的问题。请不要介意。

我正在添加新的链接（a）元素，由划分为id="whatever"

$("#whatever").append(jQuery('<a>').attr('href', 'url').text('blah'));

并调用一个函数

$(function () {
  $('#whatever a').tagcloud();
});

在该特定div内的每个链接元素上。但这个函数只在旧元素上调用，而不是在我刚刚动态添加的元素上调用。我试过这样做：

$(document).on("change", '#whatever', function () {
    $("whatever a").tagcloud();  
});

但它仍然不起作用。

var $link = $('<a>').attr('href', 'url').text('blah');
$("#whatever").append($link);
$link.tagcloud();

$(document).on("change"永远不会开火。

对编辑的响应，请尝试以下操作：

$(document).on("change", '#whatever', function () {
    $("#whatever a").tagcloud();  
});

我想你可能忘记了选择器中的#。

它似乎没有按预期工作，因为您缺少向要附加的元素添加rel属性。

// ...
// The plugin reads the rel attributes
var tagWeights = this.map(function(){
   return $(this).attr("rel");
});

试试这个：

$('<a>').attr({'href': 'url', 'rel': 'value'})
        .text('blah')
        .tagcloud()
        .appendTo('#someWhere');

http://jsbin.com/uBAzItuj/3

在您的示例中，第一个$("whatever a")应该是$("#whatever a")，但当我遇到这种情况时，我会委托与附加相同的操作

$("#whatever").append(jQuery('<a>').attr('href', 'url').text('blah'));
$('#whatever a').off();
$('#whatever a').tagcloud();

试试这个：

$("body").on("tagcloud", "#whatever", function(){
     $("#whatever").append(jQuery('<a>').attr('href', 'url').text('blah')); 
});

查看这个类似的问题了解更多信息：

动态创建的元素上的事件绑定？

此外，jQuery还有一些信息：

http://api.jquery.com/on/

我想把这作为一个评论，但不能。希望能有所帮助。

试试这个：

$('#whatever').on('change', 'a', function() {
     $(this).tagcloud();
 });
相关文章：