Сократить код.

[Marius90]

Приветствую! При помощи библиотеки "jQuery maphilight" написал скрипт, который при клике на определенный чекбокс подсвечивает область на схеме и выделяет определенным стилем строку в таблице с описанием данной области. Код получился однотипный, но я не пойму как его сократить. Буду рад любой помощи.

$(function() {
        $('.map').maphilight({
            fillColor: '008800'
        });
        

          $("#check1").click(function(e) {
            var row = $(this).parent().parent();
            var id = row.attr("id");
            var data = $("#lot").mouseout().data('maphilight') || {};
            data.alwaysOn = !data.alwaysOn;
            
            if (this.checked) {
                 row.addClass("selected");
                 $("#lot").data('maphilight',       data).trigger('alwaysOn.maphilight');
            } else {
                  row.removeClass("selected");
               $("#lot").data('maphilight', data).trigger('alwaysOn.maphilight');
            }
        });

            $("#check2").click(function(e) {
            var row = $(this).parent().parent();
            var id = row.attr("id");
            var data = $("#lot1").mouseout().data('maphilight') || {};
            data.alwaysOn = !data.alwaysOn;
            
            if (this.checked) {
                 row.addClass("selected");
                 $("#lot1").data('maphilight', data).trigger('alwaysOn.maphilight');
            } else {
                  row.removeClass("selected");
               $("#lot1").data('maphilight', data).trigger('alwaysOn.maphilight');
            }
        });

          $("#check3").click(function(e) {
            var row = $(this).parent().parent();
            var id = row.attr("id");
            var data = $("#lot2").mouseout().data('maphilight') || {};
            data.alwaysOn = !data.alwaysOn;
            
            if (this.checked) {
                 row.addClass("selected");
                 $("#lot2").data('maphilight', data).trigger('alwaysOn.maphilight');
            } else {
                  row.removeClass("selected");
               $("#lot2").data('maphilight', data).trigger('alwaysOn.maphilight');
            }
        });
          $("#check4").click(function(e) {
            var row = $(this).parent().parent();
            var id = row.attr("id");
            var data = $("#lot3").mouseout().data('maphilight') || {};
            data.alwaysOn = !data.alwaysOn;
            
            if (this.checked) {
                 row.addClass("selected");
                 $("#lot3").data('maphilight', data).trigger('alwaysOn.maphilight');
            } else {
                  row.removeClass("selected");
               $("#lot3").data('maphilight', data).trigger('alwaysOn.maphilight');
            }
        });
    });

[рони]

Marius90,
макет бы минимальный, а так можно тригер из условия вынести, перед или после условия поставить, значения не имеет.

[Ostic]

$(function() {
	        $('.map').maphilight({
	            fillColor: '008800'
	        });
var list = {"#lot":"#check1","#lot1":"check2",...};
   for(var key in list){
     $(list.key).click(function(e) {
      ...
      $(key).data('maphilight', data)...
   };
});

как-то так имхо

[Marius90]

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

[рони]

Marius90,

$(function() {
    $(".map").maphilight({
        fillColor: "008800"
    });
    var d = $("map area");
    $("#areas tbody tr").each(function(e, b) {
        var c = d.eq(e),
            a = c.data("maphilight") || {};
        $('input[type="checkbox"]', b).on("click", function() {
            a.alwaysOn = !a.alwaysOn;
            $(b).toggleClass("selected", a.alwaysOn);
            c.data("maphilight", a).trigger("alwaysOn.maphilight")
        })
    })
});

[Aetae]

рони, называй, пожалуйста, переменные говорящими именами. До одной буквы их прекрасно сократит минификатор.)

[Marius90]

$(function() {
    $(".map").maphilight({
        fillColor: "008800"
    });
    var d = $("map area");
    $("#areas tbody tr").each(function(e, b) {
        var c = d.eq(e),
            a = c.data("maphilight") || {};
        $('input[type="checkbox"]', b).on("click", function() {
            a.alwaysOn = !a.alwaysOn;
            $(b).toggleClass("selected", a.alwaysOn);
            c.data("maphilight", a).trigger("alwaysOn.maphilight")
        })
    })
});

спс большое, все работает)

[рони]

Aetae,

$(function() {
    $(".map").maphilight({
        fillColor: "008800"
    });
    var areas = $("map area");
    $("#areas tbody tr").each(function(indx, tr) {
        var area = areas.eq(indx),
            data = area.data("maphilight") || {};
        $('input[type="checkbox"]', tr).on("click", function() {
            data.alwaysOn = !data.alwaysOn;
            $(tr).toggleClass("selected", data.alwaysOn);
            area.data("maphilight", data).trigger("alwaysOn.maphilight")
        })
    })
});

[Aetae]

рони, дык это не для меня же, а для тех кому отвечаешь.)

[рони]

Aetae,
ок.