jquery .empty（）问题：不能在插件中工作

Question

我必须为ajax加载编写一个简单的插件。 页面代码。 （由剃刀导致）

<a ajaxLoad="page" href="/Brand">Brand List</a> 

<div id="plc1"> 
    some content 
</div> 

<script type="text/javascript"> 
     $(function() { 
      $("#plc1").ajaxPageLoad(); 
     }); 
</script> 

在js代码中。

jQuery.fn.ajaxPageLoad = 
function() { 
    $('a[ajaxLoad*="page"]').click(function() { 
     $(this).empty(); 
     $(this).load(this.href); 
     return false; 
    }); 
} 

在没有此实现的页面中empty（）正常工作，但插件没有效果。 有什么问题？

谢谢。

Answer 1

似乎你希望this同时指的是div和a。

如果我理解你的代码，当你点击<a>元素时，你想清空你的插件被调用的元素。

当前，在click()处理程序中，this是<a>元素。你需要保留一个对<div>的引用，你的插件被称为外部的处理程序。

jQuery.fn.ajaxPageLoad = function() { 
     // reference the <div> container (or whatever it ends up being) 
    var container = this; 

    $('a[ajaxLoad*="page"]').click(function() { 
     container.empty();   // empty the container 
     container.load(this.href); // load into the container from the href 
     return false;    // of the <a> that was clicked 
    }); 
}; 

$(function() { 
    $("#plc1").ajaxPageLoad(); 
});