Javascript 如果body class等于X，那么做点什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4324208/
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
If body class equals X then do something?
提问by Yammi
I have this code running from an external script for an image slider for every page on a site.
我从外部脚本运行此代码，用于站点上每个页面的图像滑块。
$(document).ready(function() {
$("#slideshow").show();
$('#slider1').anythingSlider({
buildNavigation: false,
delay: 8000
})
On one of the pages I don't want the image slider to rotate automatically so I need to add an extra variable. I've put a class on the body of the page and want to do something along the lines of...
在其中一个页面上，我不希望图像滑块自动旋转，因此我需要添加一个额外的变量。我在页面的主体上放了一个类，并希望按照...
If the body has a class of 'partnerCharitiesDetail' then run this script instead of the generic one
如果主体具有“partnerCharitiesDetail”类，则运行此脚本而不是通用脚本
This is what I have tried below (without success). I have 2 questions really,
这是我在下面尝试过的（没有成功）。我真的有两个问题，
1) What happens in jQuery when there are 2 identical scripts running (like this example), will it overwrite the older one with the newer one?
1) 当有 2 个相同的脚本在运行时，jQuery 中会发生什么（像这个例子），它会用新的脚本覆盖旧的脚本吗？
2) Where am I going wrong?! Is my approach the best way to do it?
2）我哪里错了？！我的方法是最好的方法吗？
$(document).ready(function() {
$("#slideshow").show();
$('#slider1').anythingSlider({
buildNavigation: false,
delay: 8000
})
if ($('body.partnerCharitiesDetail').length > 0){
$('#slider1').anythingSlider({
buildNavigation: false,
delay: 8000,
startStopped: false
})
}
Thanks!
谢谢！
回答by BoltClock
Use the hasClass()method to check if an element has a certain class.
使用该hasClass()方法检查元素是否具有某个类。
Also, your code is a little repetitive (and could even cause AnythingSlider to run twice) — I would write it like this instead:
此外，您的代码有点重复（甚至可能导致 AnythingSlider 运行两次）——我会这样写：
$(document).ready(function() {
// Initialize options first
var options = {
buildNavigation: false,
delay: 8000
};
// Only disable startStopped if the body has this class
if ($('body').hasClass('partnerCharitiesDetail')) {
options.startStopped = false;
}
// Show the #slideshow element and start the slideshow
$('#slideshow').show();
$('#slider1').anythingSlider(options);
});
回答by Luke Duddridge
回答by karim79
if ($('body').hasClass('partnerCharitiesDetail')) {
...
I would suggest:
我会建议：
$("#slideshow").show();
var options = {
buildNavigation: false,
delay: 8000
};
if ($('body').hasClass('partnerCharitiesDetail')) {
options.startStopped = false;
}
$('#slider1').anythingSlider(options);
回答by Joonas Trussmann
The behavior depends on how the anythingSlider plugin you're using works. If the plugin accounts for reinitializing a certain element then the second initialization would override the previous, but more likely than not you'd just really mess up your DOM and get double the event listeners etc.
行为取决于您使用的任何内容滑块插件的工作方式。如果插件考虑重新初始化某个元素，那么第二次初始化将覆盖前一个，但很可能你真的搞砸了你的 DOM 并获得双倍的事件侦听器等。
As pointed out, the proper way for checking if something has a class is .hasClass("classname").
正如所指出的，检查某个东西是否有类的正确方法是 .hasClass("classname")。
if($("body").hasClass("partnerCharitiesDetail")) {
}
else {
}
Although in this specific case I'd just do
虽然在这个特定的情况下我只是做
$('#slider1').anythingSlider({
buildNavigation: false,
delay: 8000,
startStopped: !($("body").hasClass("partnerCharitiesDetail"))
})
and maybe add a comment for future explorers.
并可能为未来的探索者添加评论。
回答by Mohan Ram
Try this
尝试这个
if($("body").isClass(".partnerCharitiesDetail")) {
//code if body has specific class name
}
else {
//code if body has no specific class name
}
