javascript - 切换div问题

Question

我试图切换一些 div，但它不起作用，这是 js:

<script type="text/javascript">
        $(function(){   

            $('#toggle_full').click(function(){         
                $('#full_size').removeClass('toggle');
                $('#thumb_list').addClass('toggle');
            });
        });

        $(function(){   

            $('#toggle_thumb').click(function(){            
                $('#thumb_list').removeClass('toggle');
                $('#full_size').addClass('toggle');
            });
        });
    </script>

这是 anchor :

<div class="toggle_block">
        <a href="#" id="toggle_full"><img src="img/full_icon.jpg" alt="#"/></a>
        <a href="#" id="toggle_thumbs"><img src="img/thumbs_icon.jpg" alt="#"/></a>
    </div>

这是类(class):

.toggle {
display: none;
}

现在问题出在哪里？

Answer 1

您的 ID 不匹配。

在 HTML 中，您有 toggle_thumbs，但在代码中，您有 toggle_thumb。

<小时/>

如果您所做的只是隐藏和显示，则可以像这样大大简化代码:

http://jsfiddle.net/xTPU8/2/

$(function() {
    var $elems = $('#toggle_full').hide()
        .add('#toggle_thumb').click(function() {
            $elems.toggle();
    });
});​

编辑:使其更加高效。