Question

在具有ID 1-3的备用div之间如何在用户单击相应链接时显示每个div之间的可见性？我只希望一次显示一个div。感谢。

<a>Link 1</a><br>
<a>Link 2</a><br>
<a>Link 3</a><br>

<div id="1">
    <p align="left">Content 1</p>
    </p>
</div>
<div id="2">
    <p align="left">Content 2</p>
    </p>
</div>
<div id="3">
    <p align="left">Content 3</p>
    </p>
</div>

Answer 1

将ID添加到您的链接，以便您可以添加事件处理程序。假设您将链接ID设置为Link1，Link2，Link3，请使用以下代码连接事件处理程序：

$("#Link1").bind("click", function() {
   $("#1").show();
   $("#2").hide();
   $("#3").hide();
});

为其他链接（2＆amp; 3）编写上面的事件处理程序，调整逻辑以显示相应的div，并隐藏其他链接。

更强大的解决方案：

<a class="myLink" divId="1">Link 1</a>

$(".myLink").bind("click", function() {
   $(".myDiv").hide();
   var divId = $(this).attr("divId");
   $("#" + divId).show();
});

假设您将“myDiv”类添加到所有div中，并将“myLink”类添加到所有链接中。

工作示例： http://jsfiddle.net/8XZKx/1/

在多个div之间切换jQuery

1 个答案: