单击jQuery调用自定义函数

时间:2012-07-02 11:09:04

标签: javascript jquery function

如何在单击h1后正确调用specialHouse函数,这样仍然允许$(this)表示div.content。目前以下不适用于错误“Uncaught TypeError:Object [object Object]没有方法'specialHouse'”

function specialHouse()
{
    $(this).slideDown(500, function(){
      $(this).delay(2000).slideUp();
    });
 };

$('div.content').hide();
$('h1').on('click', function(){
    $(this).next('div.content').specialHouse();
})

感谢您的帮助:)

3 个答案:

答案 0 :(得分:6)

你必须告诉jQuery你的新功能:

jQuery.fn.specialHouse = function() {
   return this.slideDown(500, function(){
     $(this).delay(2000).slideUp();
   }
}

当我们返回this时,我们的功能是可连接的:

$("a").specialHouse().text("Hello World");

答案 1 :(得分:5)

您尝试过的方式仅适用于jQuery插件。但是,您可以像这样调用函数(上下文this将按预期设置):

$('h1').on('click', function() {
    $(this).next('div.content').each(specialHouse);
});

答案 2 :(得分:0)

尝试:

$('div.content').hide();
$('h1').on('click', function(){
    specialHouse($(this).next('div.content'));
}) 

function specialHouse(elem){
  $(elem).slideDown(500, function(){
     $(this).delay(2000).slideUp();
   });
};