0

我有一个嵌套函数，它失去了“this”的正确范围

if(tabNav === true){

$("." + tabNavClass).show();
tabNavItem.first().addClass("active");//active class on first li
tabNavItem.each(function(i){
    $(this).attr("rel",(i + 1));
});                         

tabNavItem.on("click", function(e){

    tabNavClick();
    //this works, but i don't want it defined here. i want it in the tabNavClick() function
    //var data = $(this).attr("rel");
    //console.log(data);
    e.preventDefault();

});             

}           


//tab nav function          
function tabNavClick(){

// REGISTERS UNDEFINED HERE B/C LOSES SCOPE OF "THIS". FIX?!                    
var that = $(this);
var data = that.attr("rel");
console.log(data);

tabNavItem.removeClass("active");//remove existing active class

};

我试过var that = $(this)了，但这不起作用，我不认为 .call 在这种情况下会起作用。我如何$(this).attr("rel");返回我想要的 rel # 值而不是undefined？

4

3 回答 3

2

如果您想tabNavClick()获得所需的this值，那么您需要在调用它时指定：

tabNavItem.on("click", function(e){

    tabNavClick.call(this);
    //this works, but i don't want it defined here. i want it in the tabNavClick() function
    //var data = $(this).attr("rel");
    //console.log(data);
    e.preventDefault();

});

调用函数的方式决定了this值。如果它不是方法调用并且您没有使用.call()or .apply()，那么this将在任何函数调用时重置。在这种情况下，您可以使用tabNavClick.call(this)来使this值成为您想要的值。

其中，您可以更改tabNavClick为要操作的对象获取参数：

tabNavItem.on("click", function(e){

    tabNavClick(this);
    //this works, but i don't want it defined here. i want it in the tabNavClick() function
    e.preventDefault();

});     

//tab nav function          
function tabNavClick(obj){

    var data = $(obj).attr("rel");
    console.log(data);
}
于 2013-04-10T05:08:40.953 回答
2

传递$(this)给函数

  tabNavClick($(this));

  function tabNavClick(obj){
     var that = obj;
     ....

此外，您可以将函数 tabNavClick 作为点击处理程序传递并接受事件

  tabNavItem.on("click",tabNavClick)

  function tabNavClick(e){
      e.preventDefault();
      var that=$(this);
   }
于 2013-04-10T05:00:09.173 回答
0

您可以将tabNavClick自己作为点击处理程序传递：

tabNavItem.on("click", tabNavClick);

这将以指向单击的项目tabNavClick的方式调用。this

您可以让tabNavClickreturnfalse以防止事件冒泡。此外，您也可以tabNavClick接受该事件：

function tabNavClick(e) {
    // ...
    e.preventDefault();
}
于 2013-04-10T05:04:16.267 回答