缩短jQuery多个If语句

我有三个jQuery函数，其中包括if/elseif语句。基本上，每个不同的函数根据窗口宽度是否小于或大于某个值来切换/删除不同的css类

所有函数都非常相似，我一直在尝试将它们缩短/合并为一个函数。我敢肯定它可以很容易地缩短，但我不知道怎么缩短

以下是jQuery：

jQuery(document).ready(function($) {
$('.exampleimg').click(function() {
    $('.about').hide(600);
    if (($(window).width() > 670) && ($(this).hasClass('exampleimgopen'))) {
        $(this).removeClass('exampleimgopen');
    }
    else if ($(window).width() > 670) {
        $('.exampleimg').removeClass('exampleimgopen');
        $(this).addClass('exampleimgopen');
    }
});
});

jQuery(document).ready(function($) {
$('.exampleimg').click(function() {
    $('.about').hide(600);
    if (($(window).width() < 670) && ($(this).hasClass('exampleimgopen2'))) {
        $(this).removeClass('exampleimgopen2');
    }
    else if ($(window).width() < 670) {
        $('.exampleimg').removeClass('exampleimgopen2');
        $(this).addClass('exampleimgopen2');
    }
});
});

jQuery(document).ready(function($) {
$('.exampleimg').click(function() {
    $('.about').hide(600);
    if (($(window).width() < 540) && ($(this).hasClass('exampleimgopen3'))) {
        $(this).removeClass('exampleimgopen3');
    }
    else if ($(window).width() < 540) {
        $('.exampleimg').removeClass('exampleimgopen3');
        $(this).addClass('exampleimgopen3');
    }
});
});

jQuery（文档）.ready（函数（$）{
$（'.exampleimg'）。单击（函数（）{
$（'.about'）.hide（600）；
if（$（window.width（）>670）和（$（this.hasglass（'exampleimgopen'））{
$（this.removeClass（'exampleimgopen'）；
}
else if（$（窗口）.width（）>670）{
$（'.exampleimg'）.removeClass（'exampleimgopen'）；
$（this.addClass（'exampleimgopen'）；
}
});
});
jQuery（文档）.ready（函数（$）{
$（'.exampleimg'）。单击（函数（）{
$（'.about'）.hide（600）；
if（$（window.width（）<670）和（$（this.hasClass（'exampleimgopen2'））{
$（this.removeClass（'exampleimgopen2'）；
}
else if（$（窗口）.width（）<670）{
$（'.exampleimg'）.removeClass（'exampleimgopen2'）；
$（this.addClass（'exampleimgopen2'）；
}
});
});
jQuery（文档）.ready（函数（$）{
$（'.exampleimg'）。单击（函数（）{
$（'.about'）.hide（600）；
if（$（window.width（）<540）和（$（this.hasClass（'exampleimgopen3'））{
$（this.removeClass（'exampleimgopen3'）；
}
else if（$（窗口）.width（）<540）{
$（'.exampleimg'）.removeClass（'exampleimgopen3'）；
$（this.addClass（'exampleimgopen3'）；
}
});
});

您可以创建一个包含两个参数的函数：宽度和类名

function YourFunc(width, className)
{
    var windowWidth = $(window).width();

    $('.about').hide(600);

    if (windowWidth < width && $(this).hasClass(className)) {
        $(this).removeClass(className);
    }
    else if (windowWidth < width) {
        $('.exampleimg').removeClass(className);
        $(this).addClass(className);
    }
}

函数YourFunc（宽度、类名） { var windowWidth=$（window.width（）； $（'.about'）.hide（600）； if（windowWidth

---

并在需要时调用此函数并传递相关参数。

对主类使用绑定函数，然后使条件与前面的函数类似。示例：$（'.mainClass'）.bind（）

jQuery代码的缩写格式应为

$(document).ready(function($) {
    $('.exampleimg').click(function() {

        $('.about').hide(600);

        screenwidth= var windowWidth = $(window).width();
        var classname="exampleimgopen";
        if(screenwidth<670){ classname = "exampleimgopen2"; };
        else if(screenwidth<540){ classname = "exampleimgopen3"; };

        $(this).toggleClass(classname);
    });
});

$（文档）.ready（函数（$）{
$（'.exampleimg'）。单击（函数（）{
$（'.about'）.hide（600）；
screenwidth=var windowWidth=$（window）.width（）；
var classname=“exampleimgopen”；
如果（屏幕宽度要保留所有功能，我必须创建一个包含3个变量的函数：

function image(condition, windowWidth, css) {
    return function() {
    $('.about').hide(600);
    var windowCondition = condition($(window).width(), windowWidth);
        if (windowCondition && ($(this).hasClass(css))) {
        $(this).removeClass(css);
        } 
        else if (windowCondition) {
        $('.exampleimg').removeClass(css);
        $(this).addClass(css);
        }
    }
}   

var lessThan = function(a, b) { return a < b; };
var greaterThan = function(a, b) { return a > b; };

var func1 = image(greaterThan, 669, 'exampleimgopen');
var func2 = image(lessThan, 670, 'exampleimgopen2');
var func3 = image(lessThan, 540, 'exampleimgopen3');

$('.exampleimg').click(func1);
$('.exampleimg' ).click(func2);
$('.exampleimg').click(func3);

函数图像（条件、窗口宽度、css）{
返回函数（）{
$（'.about'）.hide（600）；
var windowCondition=条件（$（window）.width（），windowWidth）；
if（windowCondition&（$（this）.hasClass（css）））{
$（此）.removeClass（css）；
} 
else if（窗口条件）{
$（'.exampleimg'）.removeClass（css）；
$（this）.addClass（css）；
}
}
}   
var lessThan=函数（a，b）{返回ab；}；
var func1=图像（大于669，“exampleimgopen”）；
var func2=图像（lessThan，670，'exampleimgopen2'）；
var func3=图像（lessThan，540，'示例imgopen3'）；
$（'.exampleimg'）。单击（功能1）；
$（'.exampleimg'）。单击（func2）；
$（'.exampleimg'）。单击（func3）；

并创建两个变量来管理小于670px和大于670px

只需单击调用每个类的函数