访问刚刚附加到DOM的jquery元素

Question

我只是添加一个DOM上的元素,如:

$("#div_element").append('<a href="#">test</a>');

在我追加它之后,我需要访问我刚刚创建的元素以便将click函数绑定到它,我试过:

$("#div_element").append('<a href="#">test</a>').click(function(){alert("test")});

但上述方法无效.我可以唯一地识别元素,但这似乎有点工作,或许有一种方法,我可以在我追加它后立即获得元素.

Answer 1

你可以这样做:

var el = $('<a href="#">test</a>');

$("#div_element").append(el);

el.click(function(){alert("test")});

// or preferrably:
el.on('click', function(){alert("test")});

append函数接受两种类型的参数:字符串或jQuery元素.如果传入一个字符串,它将在内部创建一个jQuery元素并将其附加到父元素.

在这种情况下,您希望自己访问jQuery元素,因此您可以附加事件处理程序.因此,不是传入字符串并让jQuery创建元素,而是必须先创建元素,然后将其传递给append-function.

完成后,您仍然可以访问jQuery元素以便能够附加处理程序.

Answer 2

var $a = $('<a />', {href:"#"})
  .text("test")
  .on('click', function(e) { 
     alert('Hello') 
  })
  .appendTo('#div_element');

http://jsfiddle.net/33jX4/