несколько функций почти одинаковые

Question

если у вас есть шанс, чтобы сократить этот код? на самом деле то, что он делает проверяет, установлен ли ДИВ (класс) открыт, если так близко его, и каждый БТН AKA (# Go + A, B, C, D) идет в определенном месте на HTML код

//--- Close & Go Home----// 
$(document).ready(function(){ 
    var MycloseNav = $("#go"), 
     ProjShow = $(".content_projectA, .content_projectB, .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 

    $("#go").on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
}); 

// --- Закрыть & Go портфель ---- //

$(document).ready(function(){ 
    var MycloseNav = $("#goA"), 
     ProjShow = $(".content_projectA, .content_projectB, .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 
    $("#goA").on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
}); 

// --- Закрыть & Go О ---- //

$(document).ready(function(){ 
    var MycloseNav = $("#goB"), 
     ProjShow = $(".content_projectA, .content_projectB, .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 

    $("#goB").on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
}); 

// --- Закрыть & Go Skills-- - //

$(document).ready(function(){ 
    var MycloseNav = $("#goC"), 
     ProjShow = $(".content_projectA, .content_projectB, .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 

    $("#goC").on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
}); 

// --- Закрыть & Go контакт ---- //

$(document).ready(function(){ 
    var MycloseNav = $("#goD"), 
     ProjShow = $(".content_projectA, .content_projectB, .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 

    $("#goD").on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
}); 

Answer 1

да абстрактный весь ваш аналогичный код в отдельную функцию, а затем вызвать эту функцию в пределах каждой из функции щелчка. Пример:

function similar(){ 
    if (ProjShow == MyProjShow) 
     { 
     ProjShow.hide(); 
     $('html,body').animate({scrollTop: 400}, 200); 
     $("#about, #skills, #contact, #footer").show(); 
     $("navA").hide(); 
     } 
     else{ 
     return false; 
     } 
     }); 
} 
$("#goA").on("click", function(){ 
    similar(); 
}); 

Answer 2

Так как код кажется идентичным, просто объединить селекторы с запятой (что означает совпадение любой из них):

$(document).ready(function(){ 
    var MycloseNav = $("#go, #goA, #goC, #goD"), 

Answer 3

Насколько я могу видеть, разница только в том элемент, который он применяется к каждому времени. Вы можете сделать следующее:

function init(id){ 
    var MycloseNav = $("#" + id), 
     ProjShow = $(".content_projectA, .content_projectB,  .content_projectC, .content_projectD, .content_projectE, .content_projectF, .content_projectG, .content_projectH, .content_projectI, .content_projectJ, .content_projectK, .content_projectL"), 
     MyProjShow = ProjShow.hide(); 

    $("#" + id).on("click", function(){ 
     if (ProjShow == MyProjShow) 
     { 
      ProjShow.hide(); 
      $('html,body').animate({scrollTop: 400}, 200); 
      $("#about, #skills, #contact, #footer").show(); 
      $("navA").hide(); 
     } 
     else{ 
      return false; 
     } 
    }); 
}); 

Тогда для каждого документа готовые функции имеют:

$(document).ready(function(){ 
    init("go"); 
}); 

$(document).ready(function(){ 
    init("goA"); 
}); 

$(document).ready(function(){ 
    init("goB"); 
}); 

И так далее.

Answer 4

Чтобы сократить ваш код здесь мои предложения:

1. Не используйте .classA, .classB, .classC вас не собираюсь добавлять отдельные стили CSS для них. Вместо этого замените его на один класс css. Таким образом, вы не должны использовать

   $('.classA, .classB, .classC').hide()

   но только

   $('.one-class').hide(); // All elements with class 'one-class' will be hidden

2. Вам не нужно, чтобы добавить идентификатор к каждому элементу, если все, что вы хотите сделать, это скрыть остальные и просто показать выбранный/щелкнутый. Предположим, вы хотите, чтобы скрыть все .close-nav элемент для щелкнули, кроме одного, используйте этот код:

   $('.close-nav').click(function(){ 
       $('.close-nav').hide(); 
       $(this).show(); 
   
       // Other common code here 
   });