融合两个类似的文件准备与不同的类

时间:2016-09-18 12:10:49

标签: javascript jquery html function document-ready

这两个文件准备工作正常,我只想将它们合二为一。

我的目标是让.flipperfr.click仅适用于.flip1fr,.flipfr

和.flipperen.click仅适用于.flip1en,.flipen

因为当我把它们放在一起.flipperfr.click或.flipperen.click工作

所有课程。这是我的两个js函数:

$(document).ready(function() {
var $flips = $('.flip1fr, .flipfr ');
$(".flipperfr").click(function() {
var $cur = $(this).next().stop().slideToggle("fast");
$flips.not($cur).stop().slideUp()
});
});


$(document).ready(function() {
var $flips = $('.flip1en, .flipen ');
$(".flipperen").click(function() {
var $cur = $(this).next().stop().slideToggle("fast");
$flips.not($cur).stop().slideUp()
});
});

更新 它不起作用,但在开始时我想使用一种简单的方法:

$(document).ready(function() {
var $flips = $('.flip1fr, .flipfr '); $('.flip1en, .flipen ');
$(".flipperfr"); $(".flipperen").click(function() {
var $cur = $(this).next().stop().slideToggle("fast");
$flips.not($cur).stop().slideUp()
});
});

因为这两部分函数之间只有这部分不同,

var $flips = $('.flip1fr, .flipfr '); $(".flipperfr").click(function() {
var $flips = $('.flip1en, .flipen '); $(".flipperen").click(function() {

UPDATE2,这里的问题是一切正常,但只有一方面,当我去翻盖时,另一个块保持可见,并且不像flipperfr那样隐藏。我做错了什么?

$(document).ready(function() {
var $flips = $('.flip1fr, .flipfr ');
var $flips = $('.flip1en, .flipen ');
$(".flipperfr, .flipperen").click(function() {
var $cur = $(this).next().stop().slideToggle("fast");
$flips.not($cur).stop().slideUp()
});
});

OR

$(document).ready(function() {
var 
$flips = $('.flip1fr, .flipfr ');
$flips = $('.flip1en, .flipen ');
$(".flipperfr, .flipperen").click(function() {
var $cur = $(this).next().stop().slideToggle("fast");
$flips.not($cur).stop().slideUp()
});
});

1 个答案:

答案 0 :(得分:0)

也许是这样的

$(document).ready(function() {
  var $flips = {
    fr: $('.flip1fr, .flipfr '),
    en: $('.flip1en, .flipen ')
  }

  $(".flipperfr, .flipperen").click(function() {
    var lang = $(this).hasClass('flipperfr') ? 'fr' : 'en';
    var $cur = $(this).next().stop().slideToggle("fast");
    $flips[lang].not($cur).stop().slideUp();
    // or without $flips
    $('.flip1' +lang + ', .flip' +lang ).not($cur).stop().slideUp();
  });
});