Javascript 需要使用JQuery为每个href切换一个div

有人能帮我吗。当用户单击课程链接时，我需要显示隐藏在div中的课程描述，并在单击任何链接后切换

@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.CourseID)
        </td>
        <td>
            <a title="Click to See Course Description" class="info" id="@Html.DisplayFor(modelItem => item.Title)" href="#">@Html.DisplayFor(modelItem => item.Title)</a>
        </td>
}
<div class="myshow" id="Calculus_show" style="display:none">
    <p>
        Information about a Course
    </p>
</div>

此处，切换时不显示div.myshow。

看起来在“$（'div.myshow'）”行中，您无故更改了div的ID，使其包含一个#，这会导致脚本中断。我只是简单地把它注释掉，它给了我你想要的结果。还添加了对myshow div的隐藏，因此当选择一个课程，然后选择另一个课程时，它会隐藏以前的课程div并打开新课程的div。当我这样做的时候，我假设HTML中生成的所有内容都是正确的

修改代码以显示它如何处理多个链接

$（文档）.ready（函数（）{
$（'.info'）。在（'click'，函数（e）上{
e、 预防默认值（）；
id='#'+$（this.attr（'id'）；
id=id+“_show”；
//$（'div.myshow'）.attr（'id'，id）；
$（'.myshow'）.hide（）；
$（id）.toggle（）；
})
});

1234
1234

关于微积分的信息


关于编程的信息

您可以尝试以下方法：

首先找到所有可见的
div
，然后隐藏它们。然后使用
此
，导航到必要的div并显示它


$（.action”）。在（“单击”，函数（）{
var self=这个；
$（“.info:visible”）.fadeOut（函数（）{
$（self.parent（）.find（“.info”）.fadeIn（）；
});
});
.tile、.info{
字体大小：粗体；
填充物：5px；
保证金：5px；
边框：灰色；
}
.info{
颜色：#333；
背景：ddd；
显示：无；
}
.可见{
显示：块
}

显示1
1的资料
表演2
2的资料
展示3
第3条的资料
表演4
第4条的资料

}))

只需将上面的代码替换为下面的代码，问题是您在id属性本身中添加了#，而不是在选择器中添加

$(document).ready(function () {
$('.info').on('click',function (e) {
    e.preventDefault();
    id = $(this).attr('id');
    id = id + '_show';
    $('div.myshow').attr('id', id);
    $('#' + id).toggle();
})

}))

希望这有帮助。
请显示生成的html而不是服务器代码。这就是浏览器看到的，javascript需要对您试图在
中加载新信息做出反应。myshow
div？？？@dvenkatsagar阅读问题…OP已声明内容是hidden@mambo,我认为您缺少一些功能，尤其是将新内容加载到div中……他想要的是只出现在该div上，而不是另一个div上。这仍然可以实现，因为每个链接的ID都是由foreach循环生成的，在javascript中，它将使用该ID来确定要显示的div。只有一个div，而不是很多。因此，我认为他希望在
.myshow
div中显示数据，因为我是动态提取数据的，所以我将有几个标记，每个标记都有不同的ID…因此最终的结果是，如果我有课程；Course2等，然后我想在每次单击不同的课程并拉取该课程的数据并显示在该div内时切换该div
$(document).ready(function () {
$('.info').on('click',function (e) {
    e.preventDefault();
    id = '#' + $(this).attr('id');
    id = id + '_show';
    $('div.myshow').attr('id', id);
    $(id).toggle();
})

$(document).ready(function () {
$('.info').on('click',function (e) {
    e.preventDefault();
    id = $(this).attr('id');
    id = id + '_show';
    $('div.myshow').attr('id', id);
    $('#' + id).toggle();
})