2010-05-28 3 views
1

У меня есть ниже код, написанный на JQuery:JQuery оптимизация текущего кода меню

var href = window.location.href; 
if (href.search('/welcome\\/') > 0) 
{ 
    $('.menuwelcome').css('display', 'block'); 
    $('#welcome2').append('<b>Приглашаем субагентов</b>').find('a').remove(); 
    $('#welcome2').find('img').attr('src', '/static/images/arrow_black.gif'); 
} 
if (href.search('/contacts\\/') > 0) 
{ 
    $('.menuwelcome').css('display', 'block'); 
    $('#mcontacts').append('<b>Контакты</b>').find('a').remove(); 
    $('#mcontacts').find('img').attr('src', '/static/images/arrow_black_down.gif'); 
} 
if (href.search('/sindbad_history\\/') > 0) 
{ 
    $('.menuwelcome').css('display', 'block'); 
    $('.menuwelcome:first').append('<b>История</b>').find('a').remove(); 
    $('.menuwelcome:first').find('img').attr('src', '/static/images/arrow_black.gif'); 
} 
if (href.search('/insurance\\/') > 0) 
{ 
    $('.menusafe').css('display', 'block'); 
    $('#msafe').append('<b>Страхование</b>').find('a').remove(); 
    $('#msafe').find('img').attr('src', '/static/images/arrow_black_down.gif'); 
} 
if (href.search('/insurance_advices\\/') > 0) 
{ 
    $('.menusafe').css('display', 'block'); 
    $('.menusafe:first').append('<b>Полезная информация</b>').find('a').remove(); 
    $('.menusafe:first').find('img').attr('src', '/static/images/arrow_black.gif'); 
} 

Код выше есть повторяющиеся задачи, можем ли мы сделать код компактным? Я хочу свести этот код к минимуму. Как мне это достичь?

+0

Можете ли вы показать нам HTML-код для меню? – Skilldrick

+0

Минимизирующий код не имеет отношения к StackOverflow –

ответ

3

Поместите все переменные биты в словаре массивов:

cases = { 
    '/welcome\\/' : ['.menuwelcome', '#welcome2' , 'Приглашаем субагентов', 'arrow_black.gif'  ], 
    '/contacts\\/': ['.menuwelcome', '#mcontacts', 'Контакты'    , 'arrow_black_down.gif'], 
    ... 
}; 

Затем цикл по делам:

for (c in cases) { 
    if (href.search(c)) { 
     a = cases[c]; 
     $(a[0]).css('display', 'block'); 
     $(a[1]).append('<b>' + a[2] + '</b>').find('a').remove(); 
     $(a[1]).find('img').attr('src', '/static/images/' + a[3]); 
    } 
} 
+1

Отличная идея. Обратите внимание, что URL-адрес изображения отличается в разных случаях. Возможно, вы хотите «вырваться» из цикла, как только вы найдете совпадение. – tvanfosson

+0

Спасибо, @tvanfosson. Я пропустил вариацию изображений. Измененный. –

0

Если ссылка, что вы удаляете содержит тот же самый текст, который вы вставляете , который, как я подозреваю, имеет место, вы можете использовать unwrap вместо того, чтобы отслеживать его. Это сделает его более устойчивым к изменениям в тексте. Я также предпочел бы использовать класс для изменения стиля шрифта для «текущего» пункта меню. Выключение @ Решение Marcelo:

$(a[1]).find('a').unwrap().addClass('current-menu-item'); 
Смежные вопросы