javascript - 瘦身弹出代码

Question

我仍在学习 jquery/javascript，所以请原谅我非常困惑的代码。我已经设置了覆盖功能，但必须为每个链接重复它。我正在寻找一种精简此代码的方法，这样我就不必不断重复每个链接的打开和关闭按钮。抱歉，如果这听起来不够清楚。 fiddle 在下面。谢谢!

http://jsfiddle.net/olichalmers/a2p3J/1/

jQuery(document).ready(function () {

var content = $("#content");
var logo = $("#logo");
var links = $("#links");
var social_orb = $("#social_orb");
var links_exit = $("#linksexit");
var introintro = $("#introintro");
var overlayintro = $("#overlayintro");
var exitintro = $("#exitintro");
var comingfrom = $("#comingfrom");
var overlaycomingfrom = $("#overlaycomingfrom");
var exitcomingfrom = $("#exitcomingfrom");
var nikkisays = $("#nikkisays");
var overlaynikki = $("#overlaynikkisays");
var exitnikkisays = $("#exitnikkisays");
var mobile_social = $("#mobile_social");
var mobileintro = $("#mobile_introintro");
var mobilecomingfrom = $("#mobile_comingfrom");
var mobilenikki = $("#mobile_nikkisays");

introintro.on("click", function () { content.fadeOut(50); setTimeout(function () { overlayintro.fadeIn(50) }, 100) });

mobileintro.on("click", function () { content.fadeOut(50); setTimeout(function () { overlayintro.fadeIn(50) }, 100) });

exitintro.on("click", function () { overlayintro.fadeOut(50); setTimeout(function () { content.fadeIn(50) }, 100) });

comingfrom.on("click", function () { content.fadeOut(50); setTimeout(function () { overlaycomingfrom.fadeIn(50) }, 100) });

mobilecomingfrom.on("click", function () { content.fadeOut(50); setTimeout(function () { overlaycomingfrom.fadeIn(50) }, 100) });

exitcomingfrom.on("click", function () { overlaycomingfrom.fadeOut(50); setTimeout(function () { content.fadeIn(50) }, 100) });

nikkisays.on("click", function () { content.fadeOut(50); setTimeout(function () { overlaynikki.fadeIn(50) }, 100) });

mobilenikki.on("click", function () { content.fadeOut(50); setTimeout(function () { overlaynikki.fadeIn(50) }, 100) });

exitnikkisays.on("click", function () { overlaynikki.fadeOut(50); setTimeout(function () { content.fadeIn(50) }, 100) });

})

Answer 1

您可以用逗号分隔选择器，例如:

$('#introintro,#mobile_introintro').on("click", function () { 
    content.fadeOut(50); setTimeout(function () { 
        overlayintro.fadeIn(50) 
    }, 100) 
});