javascript - 在 jQuery 中按名称显示/隐藏 Div

Question

我的 HTML 主体末尾有以下 JavaScript:

<script>
$(document).ready(function() {
    $("a").click(function(event) {
        var div_to_show=event.target.id;
        var real_div=div_to_show.split('-');
        var display_div=real_div[0];
        var elementPos=$("#"+div_to_show).offset();
        var top_pos=elementPos.top-118.5;           
        $('#board-right div').hide(); 
        $("#" + display_div).css('margin-top',top_pos); 
        $("#" + display_div).show(); 
    });
});
</script>

这是它应该操作的 HTML:

<div id="board-left">
<div id="board-names">
    <a id="marci-link">Marci Weisler</a><br />
    <a id="nicholas-link">Nicholas Rey</a><br />
</div>
</div><!-- #board-left -->

<div id="board-right">
    <div id="marci" style="display:none;">
    <p>
        Marci Weisler is an accomplished...
    </p>
</div>
<div id="nicholas" style="display:none;">
    <p>
        Nicholas Rey is a French-born...
    </p>
</div>      
</div><!-- board-right -->

因此，代码应该从点击的链接中获取 div 名称，删除“-link”部分，然后显示适当的 div。当前，当我单击链接时没有任何反应。在我写这篇文章时，我想知道这是否是 CSS 问题？有什么想法吗？

顺便说一下，文档中有一个指向 jQuery 1.3 的链接。

Answer 1

如果你检查http://jsfiddle.net/pramodpv/YvYBD/ ,

你会发现 top pos 是负数.. 如果你按照你的要求更正它就可以了

PS:在发布您的问题时尝试使用 jsfiddle，这样人们就可以处理您的代码并更快地给出答案...大多数 prb，您会自己找到答案 :D