Question

$('#show00').click(function () {

    $('#n000,#n010,#n020,#n030,#n040,#n050,#n060,#n070').stop(true, false).fadeIn();

});

$('#hide00').click(function () {
    $('#n000,#n010,#n020,#n030,#n040,#n050,#n060,#n070').stop(true, false).fadeOut();

});

$('#show01').click(function () {
    $('#n001,#n011,#n021,#n031,#n041,#n051,#n061,#n071').stop(true, false).fadeIn();

});

$('#hide01').click(function () {
    $('#n001,#n011,#n021,#n031,#n041,#n051,#n061,#n071').stop(true, false).fadeOut();

});

$('#show02').click(function () {
    $('#n002,#n012,#n022,#n032,#n042,#n052,#n062,#n072').stop(true, false).fadeIn();

});

$('#hide02').click(function () {

    $('#n002,#n012,#n022,#n032,#n042,#n052,#n062,#n072').stop(true, false).fadeOut();

});

$('#show03').click(function () {
    $('#n003,#n013,#n023,#n033,#n043,#n053,#n063,#n073').stop(true, false).fadeIn();

});

$('#hide03').click(function () {

    $('#n003,#n013,#n023,#n033,#n043,#n053,#n063,#n073').stop(true, false).fadeOut();

});

$('#show04').click(function () {

    $('#n004,#n014,#n024,#n034,#n044,#n054,#n064,#n074').stop(true, false).fadeIn();

});

$('#hide').click(function () {

    $('#n004,#n014,#n024,#n034,#n044,#n054,#n064,#n074').stop(true, false).fadeOut();

});

$('#show').click(function () {

    $('#n005,#n015,#n025,#n035,#n045,#n055,#n065,#n075').stop(true, false).fadeIn();

});

$('#hide05').click(function () {

    $('#n005,#n015,#n025,#n035,#n045,#n055,#n065,#n075').stop(true, false).fadeOut();

});

$('#show06').click(function () {

    $('#n006,#n016,#n026,#n036,#n046,#n056,#n066,#n076').stop(true, false).fadeIn();

});

$('#hide06').click(function () {

    $('#n006,#n016,#n026,#n036,#n046,#n056,#n066,#n076').stop(true, false).fadeOut();

});

$('#show07').click(function () {

    $('#n007,#n017,#n027,#n037,#n047,#n057,#n067,#n077').stop(true, false).fadeIn();

});

$('#hide07').click(function () {

    $('#n007,#n017,#n027,#n037,#n047,#n057,#n067,#n077').stop(true, false).fadeOut();

});

$('#show08').click(function () {

    $('#n008,#n018,#n028,#n038,#n048,#n058,#n068,#n078').stop(true, false).fadeIn();

});

$('#hide08').click(function () {

    $('#n008,#n018,#n028,#n038,#n048,#n058,#n068,#n078').stop(true, false).fadeOut();

});

$('#show09').click(function () {

    $('#n009,#n019,#n029,#n039,#n049,#n059,#n069,#n079').stop(true, false).fadeIn();

});

$('#hide09').click(function () {

    $('#n009,#n019,#n029,#n039,#n049,#n059,#n069,#n079').stop(true, false).fadeOut();

});

$('#show010').click(function () {

    $('#n0010,#n0110,#n0210,#n0310,#n0410,#n0510,#n0610,#n0710').stop(true, false).fadeIn();

});

$('#hide010').click(function () {

    $('#n0010,#n0110,#n0210,#n0310,#n0410,#n0510,#n0610,#n0710').stop(true, false).fadeOut();

});

$('#show011').click(function () {

    $('#n0011,#n0111,#n0211,#n0311,#n0411,#n0511,#n0611,#n0711').stop(true, false).fadeIn();

});

$('#hide011').click(function () {

    $('#n0011,#n0111,#n0211,#n0311,#n0411,#n0511,#n0611,#n0711').stop(true, false).fadeOut();

});

Answer 1

看起来循环有助于你的事业。

for(var i=0; i<=11; i++) {
  $('#show0' + i).click(function() {                     
    $('#n00' + i + ',#n01' + i + ',#n02' + i + ',#n03' + i + ',#n04' + i + ',#n05' + i + ',#n06' + i + ',#n07' + i).stop(true,false).fadeIn();
  });
  $('#hide0' + i).click(function() {                     
    $('#n00' + i + ',#n01' + i + ',#n02' + i + ',#n03' + i + ',#n04' + i + ',#n05' + i + ',#n06' + i + ',#n07' + i).stop(true,false).fadeOut();
  });
}

Answer 2

我无法自拔。：/

$("[id^=show0],[id^=hide0]").click(function(e) {
    if (/^(hide|show)0(\d+)$/.test(this.id)) {
        var fade = RegExp.$1 == "show" ? "fadeIn" : "fadeOut";
        var n = RegExp.$2;
        var selector = new Array(8).join(".").split(".").map(function(v, i) {
            return "#n0" + i + n;
        }).join(",");
        $(selector).stop(true, false)[fade]();
    }
});

jsfiddle（vs your code for comparison）

这很有趣，但实际上这完全是黑客攻击。 elclanrs是对的。不要给元素增加id。要么给每个人一个有意义的id，要么，如果他们是一个集合的一部分，给他们一个公共类，并在需要时通过索引访问它们。

初学者开发人员（可悲的是，一些经验丰富的开发人员）很想在需要两次执行相同操作时复制和粘贴代码。如果您发现自己复制和粘贴了多行代码，或者甚至只是多行代码，请停止。您可以编写一个函数来为您完成。它为代码的可维护性带来了好处。

我想简化这些代码。有什么想法吗？

2 个答案: