javascript - 这两端jquery怎么合成一段？简写一下。

问题描述

问 题

var a = 0;
var step = 0;
    $('.recommend .next').click(function () {
        (a < 3) ? (a ++, step = (a * 1226) + 'px', $('.recommend .recommendList').css('left' , '-' + step)) : 1 ;
        (a == 3) ? $(this).css({color:'#ccc', border:'1px solid #ccc', cursor:'default'}
            , $(this).siblings('div.p').css({color:'#000', border:'1px solid #000', cursor:'pointer'})) : 1 ;
    });
    
    $('.recommend .prev').click(function () {
        (a > 0) ? (a --, step = (a * 1226) + 'px', $('.recommend .recommendList').css('left' , '-' + step)) : 1 ;
        (a == 0) ? $(this).css({color:'#ccc', border:'1px solid #ccc', cursor:'default'}
            , $(this).siblings('div.p').css({color:'#000', border:'1px solid #000', cursor:'pointer'} )) : 1 ;
    });

这两段怎么合成一段？
a<3 a>0 a++ a--不会弄。

请大神看一下

解决方案

var operations = {
    operation1: {
        compare (a) {
            return a < 3
        },
        equal (a) {
            return a == 3
        },
        calc (a) {
            a++
        }
    },
    operation2: {
        compare (a) {
            return a > 0
        },
        equal (a) {
            return a == 0
        },
        calc (a) {
            a--
        }
    }
}
 $('.recommend .next, .recommend .prev').click(function (event) {
        var operation = $(event.target).hasClass('next') ? operations.operation1 : operations.operation2
        operation.compare(a) ? 
        (operation.calc(a), step = (a * 1226) + 'px', $('.recommend .recommendList').css('left' , '-' + step)) : 
        (operation.equal(a) ? 
        $(this).css({color:'#ccc', border:'1px solid #ccc', cursor:'default'},             $(this).siblings('div.p').css({color:'#000', border:'1px solid #000', cursor:'pointer'})) : 1) 

});
    

代码可读性很重要，不建议这样改

这篇关于javascript - 这两端jquery怎么合成一段？简写一下。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！