Question

我有以下代码：

$('<div id="' + id + '"><a href="#" class="edit">Edit</a> | <a href="#" class="remove">Remove</a><br /><h1>' + title + '</h1><br /><p>' + content + '</p></div><hr>').prependTo('#content').hide().slideDown('normal');

addFunctionality(this);

function addFunctionality(scope){
   //Remove-section
   $('.remove', scope).click(function(e){
      e.preventDefault(); ...
   });
}

this不应该引用插入的DOM元素吗？这样，如果我点击课程remove？

的链接，就不会发生任何事情

Answer 1

this指的是调用函数的对象上下文的对象。如果您在ready函数中使用上述代码，this实际上是整个HTML文档。 this可用于jQuery事件回调（如click事件），以引用触发该操作的DOM对象。无论你正在调用什么函数，this都不会在函数中间发生变化。

要获得所需内容，请将返回的jQuery对象保存在变量中并将其传递给您的函数：

var $elements = $('<div id="' + id + '"><a href="#" class="edit">Edit</a> | <a href="#"
  class="remove">Remove</a><br /><h1>' 
  + title + '</h1><br /><p>' + content + '</p></div><hr>')
.prependTo('#content')
.hide().slideDown('normal');

addFunctionality($elements);

function addFunctionality(scope){
    //Remvoe-section
    $('.remove', scope).click(function(e){
        e.preventDefault(); ...
    });
}

Answer 2

我不确定这如何适合您现有的代码，但您可以考虑将.find()链接起来选择您刚创建的a.remove元素，因此：

$('<div id="' + id + '"><a href="#" class="edit">Edit</a> | <a href="#"
   class="remove">Remove</a><br /><h1>' 
   + title + '</h1><br /><p>' + content + '</p></div><hr>')
.prependTo('#content')
.hide().slideDown('normal')
.find('a.remove').click(function(e){
    e.preventDefault(); //...
});

请参阅http://api.jquery.com/find/

我还要看一下http://api.jquery.com/jQuery.template/来清理那个错综复杂的元素。

在.prependTo（）之后用'this'选择什么？

2 个答案: