Назначение нескольких классов для одного события

У меня есть событие click, которое я хочу назначить больше, чем класс. Причина этого в том, что я использую это событие в разных местах моего приложения, а кнопки, которые вы нажимаете, имеют разные стили в разных местах.

Я хочу что-то вроде $('. tag' '.tag2'), который, конечно, не работает.

    $('.tag').click(function (){
        if ($(this).hasClass('clickedTag')){
            // code here
        }

        else {
             // and here
        }
    });

Ответы

Ответ 1

Подход № 1

function doSomething(){
    if ($(this).hasClass('clickedTag')){
        // code here
    }
    else {
         // and here
    }
}

$('.tag1').click(doSomething);
$('.tag2').click(doSomething);

// or, simplifying further
$(".tag1, .tag2").click(doSomething);

Подход № 2

Это также будет работать:

$(".tag1, .tag2").click(function(){
   alert("clicked");    
});

Fiddle

Я предпочитаю отдельную функцию (подход # 1), если есть вероятность, что логика будет повторно использована.

См. также Как выбрать элемент с несколькими классами? для обработки нескольких классов в одном и том же элементе.

Ответ 2

Вы можете сразу выбрать несколько классов с помощью jQuery следующим образом:

$('.tag, .tag2').click(function() {
    var $this = $(this);
    if ($this.hasClass('tag')) {
        // do stuff
    } else {
        // do other stuff
    }
});

Предоставление второго параметра функции $(), позволяет селектору, поэтому $('.tag', '.tag2') ищет tag внутри элементов с классом tag2.

Ответ 3

Это так:

$('.tag.clickedTag').click(function (){ 
 // this will catch with two classes
}

$('.tag.clickedTag.otherclass').click(function (){ 
 // this will catch with three classes
}

$('.tag:not(.clickedTag)').click(function (){ 
 // this will catch tag without clickedTag
}

Ответ 4

    $('.tag1, .tag2').on('click', function() {

      if ($(this).hasClass('clickedTag')){
         // code here
      } else {
         // and here
      }

   });

или

function dothing() {
   if ($(this).hasClass('clickedTag')){
        // code here
    } else {
        // and here
   }
}

$('.tag1, .tag2').on('click', dothing);

или

 $('[class^=tag]').on('click', dothing);

Ответ 5

Вы пробовали это:

 function doSomething() {
     if ($(this).hasClass('clickedTag')){
         // code here
     } else {
         // and here
     }
 }

 $('.tag1, .tag2').click(doSomething);

Ответ 6

    $('[class*="tag"]').live('click', function() {
      if ($(this).hasClass('clickedTag')){
         // code here
      } else {
         // and here
      }
   });