在事件处理程序中重构多个if语句

时间:2016-06-15 14:12:09

标签: jquery if-statement for-loop refactoring

我试图检测一个条件是返回true还是false。唯一的问题是我有一堆if / else语句。是否可以用更少的线重构这个?也许是for循环或重写我的标记?

$(document).on('click', '.cert-modal-btn', function(event) {
    event.preventDefault();

    var certNcv        = $(this).data("ncv"),
        certDealer     = $(this).data("cert"),
        certExpress    = $(this).data("express"),
        certOne        = $(this).data("dealone"),
        certPromise    = $(this).data("iscustomer"),
        certEcomm      = $(this).data("isecomm"),
        $tabbedMenu    = $('.tabbed-menu').find('li'),
        $certsDescription = $('.certs-description').find('li');

    if(certNcv) {
        console.log("certNcv is true");
        $tabbedMenu.eq(0).removeClass('hidden-item');
        $certsDescription.eq(0).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(0).addClass('hidden-item');
        $certsDescription.eq(0).addClass('hidden-item');
    }
    if (certExpress == "X") {
        console.log("certExpress is X");
        $tabbedMenu.eq(1).removeClass('hidden-item');
        $certsDescription.eq(1).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(1).addClass('hidden-item');
        $certsDescription.eq(1).addClass('hidden-item');
    }
    if(certEcomm) {
        console.log("certEcomm is true");
        $tabbedMenu.eq(2).removeClass('hidden-item');
        $certsDescription.eq(2).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(2).addClass('hidden-item');
        $certsDescription.eq(2).addClass('hidden-item');
    }
    if(certOne) {
        console.log("certOne is true");
        $tabbedMenu.eq(3).removeClass('hidden-item');
        $certsDescription.eq(3).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(3).addClass('hidden-item');
        $certsDescription.eq(3).addClass('hidden-item');
    }
    if(certPromise) {
        console.log("certPromise is true");
        $tabbedMenu.eq(4).removeClass('hidden-item');
        $certsDescription.eq(4).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(4).addClass('hidden-item');
        $certsDescription.eq(4).addClass('hidden-item');
    }
    if(certDealer) {
        console.log("certDealer is true");
        $tabbedMenu.eq(5).removeClass('hidden-item');
        $certsDescription.eq(5).removeClass('hidden-item');
    }
    else {
        $tabbedMenu.eq(5).addClass('hidden-item');
        $certsDescription.eq(5).addClass('hidden-item');
    }
    // console.log(certNcv);
    // console.log(certDealer); 
}); 

0 个答案:

没有答案