如何将$(this)传递给函数?

时间:2016-08-05 09:41:08

标签: javascript jquery function parameter-passing this

我的代码是:

$(document).ready(function(){

    var hCount = 0,
        eCount = 0,
        nCount = 0,
        mCount = 0;

$("#head").click(function() {
        var pPos = counter(hCount);
        $(this).animate({left:pPos+"px"}, 1000);
    });

function counter(count)
{
    count++;
    if(count === 10)
    {
        count = 0;
        pPos = 0;
    }
    else
    {
        var pPos = $(this).css('left');
        pPos = pPos.substring(0,(pPos.length-2))
        pPos -= 367;

    }

    return pPos;
}

我收到错误说明

  

未捕获的TypeError:无法读取未定义的属性“defaultView”

我不知道是什么导致了这个错误。

另外,如何在counter()中传递函数$(this) $("#head").click的值?我不能直接提到$("#head"),因为我会在重用函数计数器中的代码时,使用除#head之外的更多div来重复此功能。

3 个答案:

答案 0 :(得分:6)

只需使用elem参数扩展计数器功能,并在点击处理中传递它:

function counter(count, elem){
   // ...
}

$("#head").click(function() {
    var elem = $(this);
    var pPos = counter(hCount, elem);
    elem.animate({left:pPos+"px"}, 1000);
});

答案 1 :(得分:3)

$(this)就像任何其他对象一样。只需将其传递给您的函数:

counter(hCount, $(this));
....

function counter(count, thisFromPreviousFunction)

答案 2 :(得分:3)

  

未捕获的TypeError:无法读取未定义的属性“defaultView”

这来自这条线  var pPos = $(this).css('left');

由于$(this)未在您的函数中定义(该函数与选择器无关,因此$(this)不存在,如您所愿)。

$(document).ready(function(){

    var hCount = 0,
        eCount = 0,
        nCount = 0,
        mCount = 0;

  $("#head").click(function() {
    var pPos = counter(hCount, $(this)); // Pass the selector
    $(this).animate({left:pPos+"px"}, 1000);
  });

  function counter(count, selector) {
      count++;
      if(count === 10)  {
          count = 0;
          pPos = 0;
      }
      else {
          var pPos = selector.css('left'); // Use the given selector
          pPos = pPos.substring(0,(pPos.length-2))
          pPos -= 367;
      }
      return pPos;
  }
});

https://jsfiddle.net/yw2b4tyt/