编写 JQuery If 语句

发布于 2024-10-26 02:36:44 字数 691 浏览 4 评论 0原文

我正在尝试编写 JQuery If 语句。我想要实现的基本上是在单击某个 div(infotab)时突出显示相应的链接(a)。正如您所看到的,它们都是隐藏的,但是当单击时,它们会以漂亮的淡入淡出方式变得可见。我想突出显示被单击的项目。 (将背景颜色更改为我想要的任何颜色,例如下面代码中的红色。)

下面的代码可以工作,但不正确。它突出显示该 div 中的所有 a。我只想突出显示被单击的那个。感谢你们的帮助,你们都很棒。

$(document).ready(function () {
    $('#infotab_two_s, #infotab_three_s, #infotab_four_s, #infotab_five_s').hide();
});

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $("subnav_holster li a").css({
            "color": "red"
        });
    });
});

I am trying to write a JQuery If Statement.. What I am trying to achieve is basically to highlight the appropriate link (a) when the certain div (infotab) is clicked. They are all hidden as you can see, but when clicked, become visible in a nice fade. I want to highlight the item that was clicked. (Change the background color to whatever I want, such as red in the code below.)

The code I have below works, but incorrectly. It highlights all of the a's in that div. I just want the one highlighted that was clicked. Thanks for your help you guys are great.

$(document).ready(function () {
    $('#infotab_two_s, #infotab_three_s, #infotab_four_s, #infotab_five_s').hide();
});

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $("subnav_holster li a").css({
            "color": "red"
        });
    });
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

温柔女人霸气范 2024-11-02 02:36:44

获取被单击的 li 并访问该元素的 a

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    var clicked = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        clicked.find('a').css({
            "color": "red"
        });
    });
});

Grab the li that was clicked and access that element's a:

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    var clicked = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        clicked.find('a').css({
            "color": "red"
        });
    });
});
垂暮老矣 2024-11-02 02:36:44

您应该缓存 this 然后突出显示它:

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s',
        $this = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $('.subnav_holster li a').css({
            "background-color": "white" // reset all to default color
        });
        $this.find('a').css({
            "background-color": "red"   // set highlight to this element only
        });
    });
});

You should cache this and then highlight it:

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s',
        $this = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $('.subnav_holster li a').css({
            "background-color": "white" // reset all to default color
        });
        $this.find('a').css({
            "background-color": "red"   // set highlight to this element only
        });
    });
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文