javascript - 多个类的选择不起作用

Question

这是我的JS

$('.normal-box').click(function(){
    //unique row id
   var id = $(this).data('row-id');
   //its index according to the content array
   var index = $(this).data('index');
   //which card does this row belong to
   var card_name = $(this).data('id');
   var card;
   console.log(id) //el id de noten es de por si "link last_updated" concatenado
   switch(card_name){
       case "noten" : card = Unidos.CardManager.getCard(card_name); break;
       case "nachricht" : card = Unidos.CardManager.getCard(card_name); break;
       default : return false;
   }
   card.resetPriorityWhenClickedOn(id);
});

我的 HTML

 <script id="nachricht_card_row_template" type="text/html">
            <div class="normal-box" data-row-id="{{id}}">
                        <div class="img-box">
                            {{#if channel.image}}
                            <img src="{{channel.image}}" vspace="3">
                            {{/if}}
                        </div>
                        <div class="subtitle-box" id="nachrichten-subtitle-box">
                            <span class="options-title" id="title-text">{{channel.name}}</span>
                        </div>
                        <div class="side-text-box">
                            <span class="side-text">{{formatDate datetime}}</span>
                        </div>
                        <div class="small-text">
                            <div class="normal-text"><span class="text-formating">{{text}}</span></div>
                        </div>
            </div>
        </script>

我的 CSS

.normal-box{ /*Container of other tiny boxes*/
    height: 70px;
    border-bottom: 1px solid;
    border-bottom-color: gainsboro;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.5s ease 0.3s;
}
.normal-box.show{
    opacity: 1;
}

如您所见，我想选择 $('.normal-box) ，但我有另一个函数，它添加了一个类，即 .normal-box show...使用上面的代码，我只能使 .normal-box 元素工作，而不是 .normal-box 显示...这就是我对 .normal-box 显示类的意思:

我已经试过了:

$('.normal-box, .normal-box show)
$('.normal-box, .show)
$('.normal-box.normal-box show)
$('.normal-box.show)

它们都不起作用。任何帮助将不胜感激

Answer 1

通常，$('.normal-box') 将匹配任何具有类 normal-box 的元素，除非元素是动态添加的，然后您需要使用像这样的事件委托(delegate):

$(document).on('click', '.normal-box', function(){
   //Your code here
});

希望对您有所帮助。