jQuery 为一个事件分配一个以上的班级

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10511897/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 09:27:18  来源:igfitidea点击:

Assigning more than one class for one event

jqueryclassevents

提问by holyredbeard

I have an click event that I want to assign to more than class. The reason for this is that I'm using this event on different places in my application, and the buttons you click have different styling in the different places.

我有一个点击事件,我想分配给多个班级。这样做的原因是我在应用程序的不同位置使用了这个事件,并且您单击的按钮在不同位置具有不同的样式。

What I want is something like $('.tag' '.tag2'), which of course don't work.

我想要的是像 $('.tag' '.tag2') 这样的东西,这当然不起作用。

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

        else {
             // and here
        }
    });

回答by Tim Medora

Approach #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);

Approach #2

方法#2

This will also work:

这也将起作用:

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

Fiddle

小提琴

I prefer a separate function (approach #1) if there is a chance that logic will be reused.

如果有机会重用逻辑,我更喜欢单独的函数(方法#1)。

See also How can I select an element with multiple classes?for handling multiple classes on the same item.

另请参阅如何选择具有多个类的元素?用于处理同一项目的多个类。

回答by James Simm

You can select multiple classes at once with jQuery like this:

您可以使用 jQuery 一次选择多个类,如下所示:

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

Giving a 2nd parameter to the $() function, scopes the selector so $('.tag', '.tag2')looks for tagwithin elements with the class tag2.

为 $()​​ 函数提供第二个参数,限定选择器的范围,以便在具有 class 的元素中$('.tag', '.tag2')查找。tagtag2

回答by thecodeparadox

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

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

   });

or

或者

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

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

or

或者

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

回答by fmsf

It's like this:

就像这样:

$('.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
}

回答by adrien

Have you tried this:

你有没有试过这个:

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

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

回答by Thulasiram

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