事件里面的"this"是什么.on('click', 'class', function () {})

Question

我尝试访问我单击以添加或删除 class 的行，但似乎我误解了 this 的值。它不应该是调用事件的 DOM（在本例中为 <li>）吗？这是我的代码：

JAVASCRIPT

$(document).on('click', '.ToDownload', function() 
        {
            if($(this).className.lastIndexOf("isSelected") != -1)
            {
                $(this).addClass("isSelected");
                $(this).css('border', '2px solid #000099')
            }
            else
            {
                $(this).removeClass("isSelected");
                $(this).css('border', 'none')
            }
        });

HTML

<li id="addedDownloadFileRow" class="fitting ToDownload">
    <a href="#">
        <div class="ui-grid-a">
            <div class="ui-block-a">test1</div>
            <div class="ui-block-b">test2</div>
        </div>
    </a>
</li>

事实上，我认为我可以使用属性 className 来查找我的行是否已被选中，但似乎 this 不是 DOM <li> 标签。任何信息或查看 this 真正含义的方法都将不胜感激。

P.S。 class "fitting" 仅用于某些 css 目的。

Answer 1

如果您使用 Chrome（不确定这是否适用于 Firefox），您可以将 this 的值记录到控制台。

如果它是一个 jQuery 对象，可能不清楚它指的是哪个元素，但是很容易找出底层元素。

console.log(this[0]);

这将为您提供元素本身的最小表示，如果将鼠标悬停在它上面，您会看到该元素在 Web 视图本身中突出显示。

这样您就可以确切地看到它指的是哪个元素。如评论中所述，您还可以使用 console.dir(element).

将元素的直接对象形式记录到控制台

Answer 2

this 是一个 DOM Element，$(this) 是一个 jQuery 对象

完整的工作代码在 http://jsfiddle.net/tomi77/xgv8q9md/

事件里面的"this"是什么.on('click', 'class', function () {})

What is "this" inside the event .on('click', 'class', function () {})

javascript

jquery

this

event-delegation