Question

我想弄清楚为什么jQuery中的$(this)在这种情况下不起作用：

<ul>                
    <li class="tabs-li-js ui-tabs-tab ui-tabs-active">
      <a href="#fragment-1" class="anchor-tabs" id="ui-id-1">Online Investing</a>
    </li>

    <li class="tabs-li-js ui-tabs-tab">
      <a href="#fragment-2" class="anchor-tabs" id="ui-id-2">Guided Investing</a>
    </li>              
</ul>

这是js函数：

var $tabsLiJs = $('.tabs-li-js');
var productDescriptionMob = function() {
    $tabsLiJs.on('click', function(e) {
        e.preventDefault();
        $tabsLiJs.each(function(i, el) {
            if ($(el).hasClass('ui-tabs-active')) {
                $('[data-action="show'+i+'"]').show();
            } else {
                $('[data-action="show'+i+'"]').hide();
            }
        });

    });
};

它的上述方式非常有效。

正如您所看到的，在第二行中有一个元素：$tabsLiJs，它有一个on click事件。然后，在.each函数中，我试图在上下文中添加$(this)。但它没有用。

我正在尝试使用此处：

$(this).each(function(i, el) {
     if ($(el).hasClass('ui-tabs-active')) {
          $('[data-action="show'+i+'"]').show();
     } else {
          $('[data-action="show'+i+'"]').hide();
     }
});

那可能是什么？有什么建议吗？

Answer 1

$tabsLiJS是一个包含所有带有给定类名的DOM对象的jquery对象，而click-function中的this只会引用一个实际单击的元素。

Answer 2

只需更改以下功能：

$('.tabs-li-js').each(function(i, el) {
     if ($(el).hasClass('ui-tabs-active')) {
          $('[data-action="show'+i+'"]').show();
     } else {
          $('[data-action="show'+i+'"]').hide();
     }
});

Answer 3

在这种情况下，＆＃34;这个＆＃34;关键字是指＆＃34; productDescriptionMob＆＃34;对象

＆＃34; this＆＃34;关键字有四种可能的方式在Javascript中定义：

1 - 全球背景。当关键字＆＃34; this＆＃34;它不在声明的对象中，它被认为是在全局范围内，它的值是全局对象（或大多数情况下是窗口对象）。

2 - 隐含/对象：当关键字＆＃34; this＆＃34;在声明的对象中，它的值将是声明的最接近的父对象。

3 - 显式绑定：当方法＆＃34; call＆＃34;，＆＃34; apply＆＃34;或＆＃34; bind＆＃34;使用时，第一个参数定义了关键字＆＃34; this＆＃34;值将在函数内部。

4 - 新对象：当关键词＆＃34;这个＆＃34;在一个函数中，使用关键字＆＃34; new＆＃34;在它之前，＆＃34;这个＆＃34; keyword将引用新创建的对象。

您的代码是在第二种情况下设置的，隐式/对象。这意味着，因为在关键字＆＃34之前声明了最近的父对象;这个＆＃34;是＆＃34; productDescriptionMob＆＃34;对象，所以这是它的价值。

可在此处找到更多信息：https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/this

为什么来自jQuery的$（this）不起作用？

3 个答案: