jQuery - выполнить блок кода в одну строку

Question

У меня есть блок кода:

                $('#link_dwebsitedesign a').removeClass('selected');
            $('#link_dhuisstijl a').removeClass('selected');
            $('#link_dhosting a').removeClass('selected');
            $('#link_dwordpress a').removeClass('selected');
            $('#link_dseo a').removeClass('selected');
            $('#link_dcms a').removeClass('selected');
            $('#link_dslicen a').removeClass('selected');
            $('#link_dwebshop a').removeClass('selected');

И это нужно выполнить несколько раз в моем скрипте.

Нет ли селектора или чего-то еще, чтобы я мог выполнить этот блок кода в одну строку?

Пример: $('blockofcode').execute();

Answer 1

Вы можете заключить код в функцию:

     function mycode(){
        $('#link_dwebsitedesign a').removeClass('selected');
        $('#link_dhuisstijl a').removeClass('selected');
        $('#link_dhosting a').removeClass('selected');
        $('#link_dwordpress a').removeClass('selected');
        $('#link_dseo a').removeClass('selected');
        $('#link_dcms a').removeClass('selected');
        $('#link_dslicen a').removeClass('selected');
        $('#link_dwebshop a').removeClass('selected');
     }

И вызывать свою функцию где угодно:

mycode();

См. Функции Javascript учебник для болееИнформация.

Answer 2

Могу ли я предположить, что это может быть сокращено:

$('#link_dwebsitedesign a, #link_dhuisstijl a, #link_dhosting a, #link_dwordpress a, #link_dseo a,#link_dcms a, #link_dslicen a, #link_dwebshop a').toggleClass('selected');

Что делает то же самое. Вы можете поместить это в функцию следующим образом:

function jQuery_ToggleSelected()  
{  
    $('#link_dwebsitedesign a, #link_dhuisstijl a, #link_dhosting a, #link_dwordpress a, #link_dseo a,#link_dcms a, #link_dslicen a, #link_dwebshop a').toggleClass('selected');    
}  

И просто позвонил jQuery_ToggleSelected(), чтобы добавить / удалить нужный стиль для этих элементов.

Answer 3

Вы можете использовать один и тот же класс для всех и позвонить

$('.link a').removeClass('selected');

Или, если вы знаете, какой элемент вы вызываете, вы можете удалить все с идентификаторами, начинающимися со ссылки (используя div):

   $('div[id^=link_] a').removeClass('selected');

Или вызовите все из функции

function removeLinkSelects(){
    $('#link_dwebsitedesign a').removeClass('selected');
    $('#link_dhuisstijl a').removeClass('selected');
    $('#link_dhosting a').removeClass('selected');
    $('#link_dwordpress a').removeClass('selected');
    $('#link_dseo a').removeClass('selected');
    $('#link_dcms a').removeClass('selected');
    $('#link_dslicen a').removeClass('selected');
    $('#link_dwebshop a').removeClass('selected');
}
removeLinkSelects();

Скорее всего, я бы использовал их в таком порядке, если бы я не мог / не хотелДля добавления класса используйте селектор attr, а если он сильно отличается, используйте функцию.Хотя с точки зрения способа, которым код выглядит так, как будто он может быть структурирован, я был бы более склонен использовать, но, очевидно, я не знаю, почему вы их так разметили, и, скорее всего, это совершенно логично

Answer 4

Создайте небольшой плагин, который сделает это за вас, поскольку вы, кажется, делаете это все время:

(function($) {
  $.fn.removeSelected = function() {
    return $(this).each(function() {
         $('a', this).removeClass('selected');
     });   
  });
})(jQuery);

Затем передайте jQuery массив селекторов для удаления класса ...

var links_array = ['#link_dwebsitedesign', '#link_dhuisstijl', '#link_dhuisstijl', '#link_dwordpress', '#link_dseo', '#link_dcms', '#link_dslicen', '#link_dwebshop'];

function removeLinks(links) {
    $(links.join(', ')).removeSelected();
}
removeLinks(links_array);

И вуаля!

Answer 5

$('#link_dwebsitedesign a , #link_dhuisstijl a, #link_dhosting a, #link_dwordpress a, #link_dseo a, #link_dcms a, #link_dslicen a, #link_dwebshop a').removeClass('selected');

Или поместите его в функцию

Answer 6

Я бы дал всем этим элементам #link_dwebsitedesign, #link_dhuisstijl и т. Д. Общий класс, например class="link", а затем просто использовал бы .class селектор , например:

$(".link a").removeClass("selected");

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

Answer 7

Поместите его в функцию, а затем вызовите функцию.