jquery - div onclick 破坏子 radio 检查行为

Question

我折叠了一些 div 并让用户展开它们并选择单选/复选框。我有这段代码和一个简单的 jquery 脚本。问题是单选按钮检查行为被其父 div 的 onclick 处理程序破坏。我有什么想法可以解决它吗？

    <div class="tree">
        <div class="parent">Item
           <div class="parent">ParentItem
              <div>
                 <input type="radio" name="_gen" value="a"></input>LeafItem a
              </div>
              <div>
                 <input type="radio" name="_gen" value="b"></input>LeafItem b
              </div>
         </div>
        </div>
     </div>
     <script type="text/javascript">
                $(function() {
                $('div.tree div:has(div)').addClass('parent'); 
                $('div.tree div').click(function() {
                    var o = $(this);
                    o.children('div').toggle();
                    o.children($(':radio')).attr('checked', true);
                    o.filter('.parent').toggleClass('expanded');
                    return false;
                    });
                });
            </script>

Answer 1

不太确定您在这里要做什么，但是停止输入上的传播将解决在更高元素上注册点击的问题:

$(function() {
    $('div.tree div:has(div)').addClass('parent');
    $('div.tree div').click(function() {
        var o = $(this);
        o.children('div').toggle();
        o.children($(':radio')).attr('checked', true);
        o.filter('.parent').toggleClass('expanded');
        return false;
    });
    $('input[type="radio"]').on('click', function(e) {
        e.stopPropagation();
    });​
});

FIDDLE

此外，输入标签是自动关闭的，不需要关闭？