Question

我想在点击/勾选“#LGF_info”时只显示“#HideLgf”，否则隐藏它，怎么可能？

        $(document).ready(function(){
        $('#LGF_info').click(function() {
            $('#HideLgf').show(100);
        });

        $('#DDP_info').click(function () {
            $('#HideLgf').hide();
        });

        $('#EXW_info').click(function () {
            $('#HideLgf').hide();
        });


        $('#DDU_info').click(function () {
            $('#HideLgf').hide();
        });


    });

Answer 1

易。但我必须承认，我可能会改变更多（例如使用一个类而不是show()/hide()，更少的ID，一个正确的函数等），但这就是你提供给我们的全部内容。通过on使用事件委派会删除经常需要的domReady调用，并允许重复使用例如$(document) .on("click", "#DDP_info, #EXW_info, #DDU_info", function(e) { $("#HideLgf").hide(); }) .on("click", "#LGF_info", function(e) { $("#HideLgf").show(100); }) ;调用。动态添加内容。

{{1}}

Answer 2

尝试在此处使用multiple selector来简化代码，

$('#LGF_info,#DDP_info,#EXW_info,#DDU_info').click(function () {           
   var cache = $('#HideLgf');
   if(this.id == "HideLgf") {
    cache.stop().show(100);
   }
   else {
    cache.hide();
   } 
});

如何简化代码（jquery）（单选按钮）

2 个答案: