javascript - 简单的 jQuery 脚本遇到问题

Question

我是 jQuery 新手，我想创建自己的网页。所以我的问题是如果我的菜单使用 href 将每个项目链接到其指定的内容，就像这样..

<li><a href="#doc1">Doc1</a></li>
<li><a href="#doc2">Doc2</a></li>
<li><a href="#doc3">Doc3</a></li>

<script>
$(document).ready(function(() {
     $(a).click(function() {
         $(b).show();
    });
});
</script>

我应该在“a”和“b”中输入什么？我尝试过谷歌搜索，但所有示例都没有显示完整的脚本。我以前是这样做的:

<li id="doc1menu">Doc1</li>
<script>
$(document).ready(function() {
    $("#doc1menu").click(function() {
        $("#doc1content").show();
    });
});
</script>

但现在我想要一个可以用于菜单上所有项目的函数，而不是为每个项目执行一个函数。

Answer 1

尝试这个解决方案(之前包括jquery)

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

<li><a class="menu" href="#" idmenu="doc1">Doc1</a></li>
<li><a class="menu" href="#" idmenu="doc2">Doc2</a></li>
<li><a class="menu" href="#" idmenu="doc3">Doc3</a></li>

<div class="content" id="doc1" style="display:none">doc1</div>
<div class="content" id="doc2" style="display:none">doc2</div>
<div class="content" id="doc3" style="display:none">doc3</div>


<javascript type='text/javascript'>
$(document).ready(function() {
    $(".menu").click(function() {
        id = $(this).attr("idmenu");
        $(".content").hide();
        $("#"+id).show();
    });
});
</script>

测试:https://jsfiddle.net/Cuchu/cbtwndh6/