jquery - 在触发另一个时更改 1 个触发器的类别。 (1 个 Action 有 2 个触发器)

Question

我想要实现的是在触发数字 2(输入)时切换 TRIGGER1 的颜色类别。 要查看我的问题，请先单击 TRIGGER1，然后单击 TRIGGER2。盒子关闭但第一个触发器的类没有改变

HTML

<button id="trigger1" class="color-front" >TRIGGER1</button>
<input id="trigger2" type="text" placeholder="TRIGGER2">
<div id="boxToOpenOnTrigger" class="color-back elem-hide"></div>

CSS

.elem-hide{ display: none; }
.color-back{ background-color: #3d3d2d; }
.color-front{ background-color: white; }
#boxToOpenOnTrigger{ width: 300px; height: 300px; }

jQuery

$('#trigger1').on('click', function(){
    $( this ).removeClass('color-front');
    $( this ).toggleClass('color-back');
    $( "#boxToOpenOnTrigger" ).toggleClass('elem-hide');
});

$('#trigger2').on('click', function(){
    if ( $("#trigger1").hasClass( "color-back" ) ) {
        $( this ).removeClass( "color-back" );
        $( this ).addClass( "color-front" );
    } 
    $( "#boxToOpenOnTrigger" ).addClass('elem-hide');
});

我希望你能理解我，我的英语还不是很好:/

https://jsfiddle.net/gtagc01g/

Answer 1

JS

   $('#trigger1').on('click', function(){
        $( this ).removeClass('color-front');
        $( this ).toggleClass('color-back');
        $( "#boxToOpenOnTrigger" ).toggleClass('elem-hide');
    });

    $('#trigger2').on('click', function(){

        var trigger1=$("#trigger1");
        if (trigger1.hasClass( "color-back" ) ) {
            trigger1.removeClass( "color-back" );
            trigger1.addClass( "color-front" );
        } 
        $( "#boxToOpenOnTrigger" ).addClass('elem-hide');
    });

Note you were using this inside a onclick event trigger2 which refers to trigger2

DEMO