[已解决]优化重复代码 | 【有奖问答】

不二如是

这是一段“重复性”很高的代码

哪位鱼油可以通过封装函数对下面的代码优化呢？

友情提示：

1、点击id为cn（1，2，3，4）的div，被点击的显示，其余三个隐藏

---

1. $("#c1").click(function () {
   
2.         $("#div2").hide();
   
3.         $("#div3").hide();
   
4.         $("#div4").hide();
   
5.         $("#div1").show();
   
6.     })
   
7. 
   
8.     $("#c2").click(function () {
   
9.         $("#div1").hide();
   
10.         $("#div4").hide();
    
11.         $("#div3").hide();
    
12.         $("#div2").show();
    
13.     })
    
14. 
    
15.     $("#c3").click(function () {
    
16.         $("#div1").hide();
    
17.         $("#div2").hide();
    
18.         $("#div4").hide();
    
19.         $("#div3").show();
    
20.     })
    
21. 
    
22.     $("#c4").click(function () {
    
23.         $("#div1").hide();
    
24.         $("#div2").hide();
    
25.         $("#div3").hide();
    
26.         $("#div4").show();
    
27.     })

复制代码

最佳答案

月排行榜 / 总排行榜

ddd-115

2017-8-30 10:49:59

function showOrHide() {
    $('.aa').click(function() {
        var id = $(this).attr('id');
        var i = id.substring(1);
        for (var j = 1; j <= 4; j++) {
            if (j == i) {
                $('#div' + j).show();
            } else {
                $('#div' + j).hide();
            }
        }   
    });
}

跳转到最佳答案楼层

ddd-115

function showOrHide() {
    $('.aa').click(function() {
        var id = $(this).attr('id');
        var i = id.substring(1);
        for (var j = 1; j <= 4; j++) {
            if (j == i) {
                $('#div' + j).show();
            } else {
                $('#div' + j).hide();
            }
        }   
    });
}

t鬼吹灯

var list = [$("#c1"),$("#c2"),$("#c3"),$("#c4")];
for(var i =0 ; i< list.length;i++){
        list.click(function(){
                mainFn();
        });
};

function mainFn(){
        $("#div2").hide();
        $("#div3").hide();
        $("#div4").hide();
        $("#div1").show();
}

不二如是

ddd-115 发表于 2017-8-30 10:49
function showOrHide() {
    $('.aa').click(function() {
        var id = $(this).attr('id');

优化结果： 11-13优化重复代码-随机颜色.zip (36.91 KB, 下载次数: 1, 售价: 6 鱼币)

2017-11-13 09:47 上传

点击文件名下载附件