Javascript if else 与 jQuery

Question

当我单击图像时，我试图确定图像源是否包含字符串。这些图像具有 .swap-color 类。我将变量 $current_swatch 设置为图像 src 属性，并且测试成功。我的代码如下。无论我点击哪个图像，即使 TB 不在图像源中，我也会收到“包含 TB”警报。我做错了什么？

<img src="/images/Swatch-TB.jpg" class="swap-color"/>

$("document").ready(function () {
    $('.swap-color').click(function () {
        //get the image src
        var $current_swatch = $(this).attr('src');
        //check if TB is in the src
        if ($('$current_swatch:contains("TB")').length > 0 ) {
            alert ('Contains TB');
        } else {
            alert ('Does not contain TB');
        }
    });
});

Answer 1

有足够多的反馈，我将冒险发布一个答案，尽管您的问题的关键可以在评论中完成。

检查内容的方式是使用JS原生indexOf() ，而不是代码中的 jQuery 选择器方法。

以下是对您的代码的一些带注释的修订:

// Streamlined, conflict-safe document ready
jQuery(function ($) {
    $('.swap-color').click(function() {
        //get the image src
        var $current_swatch = $(this).attr('src');
        //check if TB is in the src
        // Use JS native "indexOf" rather than jQuery 
        if ($current_swatch.indexOf('TB') > -1 ) {
            alert ('Contains TB');
        } else {
            alert ('Does not contain TB');
        }
    });
});

有关检查子字符串的不同方法的更多信息，请查看此答案:Fastest way to check a string contain another substring in Javascript?