Question

我的JQuery

$(".SupOrSubButton").click(function(e) {
    var child = $(this).children().attr('id');
    if (child == 'Superscript') {
        if ($(this).hasClass('ButtonActive')) {
            $(this).removeClass('ButtonActive');
        } else {
            $('#Subscript').parent().removeClass('ButtonActive');
            $(this).toggleClass('ButtonActive');
        }
    } else if (child == 'Subscript') {
        if ($(this).hasClass('ButtonActive')) {
            $(this).removeClass('ButtonActive');
        } else {
            $('#Superscript').parent().removeClass('ButtonActive');
            $(this).toggleClass('ButtonActive');
        }
    };
});

我很想知道是否有更好的方法来完成我上面使用JQuery所做的事情，因为我需要在将来某个地方实现类似的功能。我还在学习JQuery，我知道这有用，但这是最好的方式，还是一种好方法？

最好的问候

添

Answer 1

您的代码运行正常，但如果您想缩短代码，可以试试这个：

$(".SupOrSubButton").click(function(e) {
    var child = $(this).children().attr('id');
    $(this).toggleClass('ButtonActive');
    $(".SupOrSubButton:not(:has(#" + child +"))").removeClass('ButtonActive');
});

基本上作为您的代码，它会添加ButtonActive类（如果不存在），如果存在则将其删除。并且还会从未点击的ButtonActive div中删除.SupOrSubButton ...

编辑：

详细说明：

$(".SupOrSubButton:not(:has(#" + child +"))").removeClass('ButtonActive');`

这段代码有3个部分，第一部分选择与.SupOrSubButton类匹配的元素，＆amp;第二个（:not()）否定第三个（:has()），它在原始选择器中查找与child id匹配的元素。

基本上，选择器作为一个整体意味着“寻找具有某些类的元素，这些元素没有特定的id作为孩子”

演示：http://jsfiddle.net/darkajax/3bVJ6/

Answer 2

这会完成你想要做的事吗？

JSFiddle Link

$(".group-1 .SupOrSubButton div").click(function (e) {
$(".group-1 div").removeClass('ButtonActive');
$(this).parent().addClass('ButtonActive');

}）;

有没有更好的方法在两个按钮之间切换？

2 个答案: