展开并隐藏jQuery

有人能指出下面的“坏代码”在哪里吗？不幸的是，我不能很好地链接/显示它所在的页面，但自9月份以来，当点击适当的按钮时，这就达到了显示隐藏内容的目的。现在由于某种原因，有人向我报告代码是“坏代码”，函数被破坏，需要重新编写。这段代码背后的想法是在标题中添加一个扩展按钮（expandBtn.png），当点击该按钮时，隐藏的内容会显示出来，expandBtn.png将变成一个hideBtn.png，一旦点击，它将再次隐藏内容

我不知道脚本在哪里“坏了”，或者它在做什么/不做什么，它应该做什么或不应该做什么，但是显然另一个开发人员能够在看到页面的情况下浏览代码并说它是错误的，所以我希望这里的人足够熟练地查看代码，也许可以看到什么是错误的。提前谢谢

     // FOR EACH SECTION THAT HAS THE HIDDEN CONTENT BE SURE TO CHANGE THE ID OF THE IMG IN THE MARKUP TO HAVE THE SINGULAR FORM OF THE #SWITCH ID 

    $(document).ready(function()     
    { $('div.hiddenComplexity').hide();});
            $('div.expandingBtnComplexity').click(function()
          {$('div.hiddenComplexity').slideToggle('fast');
            }); 

    $(document).ready(function(){
    var openIconPath = 'openIconPath';
    var closedIconPath = 'closedIconPath';

    $('#switch_images').click(function(){

    if($(this).attr('src') == openIconPath){
     $(this).attr('src', closedIconPath);
    }else{ 
     $(this).attr('src',openIconPath);
    }
   });
   });
   //
   //

   $(document).ready(function(){

   var openIconPath = '/resource/uploads_scope/img/expandBtn.png';
   var closedIconPath = '/resource/uploads_scope/img/hideBtn.png';

   $('#switch_image').click(function(){

   if($(this).attr('src') == openIconPath){
     $(this).attr('src', closedIconPath);
   }else{ 
     $(this).attr('src',openIconPath);
   }
   });
   });

很快，您可以：

消除冗余就绪功能

折叠选择器，以便不会多次计算检索

结果:

$(function () {
    // Set the selectors
    var $hiddenComplexity = $('div.hiddenComplexity'),
        $expandingBtnComplexity = $('div.expandingBtnComplexity'),
        $switchImage = $('#switch_image');

    // Setup the icon paths
    var openIconPath = '/resource/uploads_scope/img/expandBtn.png',
        closedIconPath = '/resource/uploads_scope/img/hideBtn.png';

    $hiddenComplexity.hide();

    // Bind the handlers
    $switchImage.click(function () {
        var src = $switchImage.attr('src');
        switchImage.attr('src', src == openIconPath ? closedIconPath : openIconPath);
    });

    $expandingBtnComplexity.click(function () {
        $hiddenComplexity.slideToggle('fast');
    });
});

---

无论哪种方式，也许你应该考虑一个更为复杂的OOP方法。

如果它有效，那么它就不会被“破坏”。这听起来像是你应该问其他开发人员的问题，不管你在这里得到了什么答案。如果这是一个文件，那么从组合

ready

函数开始。然后，我建议，根据您使用的jquery版本，您可以使用某种类型的委托，例如

on

，

delegate

，或

live

。这些方法将事件绑定到当前和将来的元素。对于具有映像路径的部分，您可以考虑使用不同于映像的元素，并通过添加/删除类来更改映像。总的来说，您需要清理重复的代码。如果您可以包含一段html代码，这可能会有所帮助……我无法询问其他开发人员。它通过第三方转发给我，询问我是否听说我的脚本被破坏了。在询问具体情况时，他说他不知道。然而，我检查了它的页面，它看起来像以前一样工作正常。报废可乐-是的，我确实不想使用图像元素，但不幸的是，我被设计师的规格和模型束缚住了。我甚至没有参加设计和开发讨论会。我只是交了一个设计并告诉我去编码它。不过，我会考虑你的建议，谢谢。我用了这个很酷…但是我似乎无法根据隐藏的div是打开还是关闭来切换图像。这里有一个我可以展示的网站：注意图像是如何不切换的。您可以通过查看源代码查看代码。