如何在jquery中创建show / hide div的多个实例？
我有以下代码
$(document).ready(function() { $('a#slick-toggle').click(function() { $('#slickbox0').toggle(400); return false; }); }); Show/Hide hidden content here 问题是，如果在页面上的html部分有超过1个这样的实例，它就不会工作。 我不是很擅长JS。 div id我要独特……但是如何让每个链接切换相应的框？
您不应该在HTML中重复ID。 但是您确实希望在jQuery中使用相同的function，因此添加一个公共类名，以便您可以将该函数应用于所有这些锚点。
此外，由于您不确定HTML结构是否可预测，因此您需要在anchor元素和div元素之间输出一个链接。 请注意下面的data-id属性：
Show/Hide
这个“334”可能是任何东西。 这将是您可以在输出内容时决定的独特内容。
现在，您的代码可以定位每个.slick-toggle类，并让它切换关联的div。
$(document).ready(function() { $('a.slick-toggle').click(function() { var dataID = $(this).attr("data-id"); $("div[data-id=" + dataID + "].slickbox").toggle(400); return false; }); });
您可以在链接和相应的div之间设置命名约定。
click/show hide me
然后一般地设置它们：
$(".toggler").click(function() { var targetId = $(this).attr("id").replace("toggle-", ""); $("#" + targetId).toggle(400); });
几天前我问了一个非常相似的问题 ，因为我遇到了同样的问题。 它可能会帮助你！ 提供了大量示例代码。
您需要以某种方式将显示/隐藏链接与相应的框连接。 我建议使用这样的东西：
Show slickbox 1 Hidden content here Show slickbox 2 Hidden content here Show slickbox 3 Hidden content here
这样，每个链接的href属性将其连接到相应的div以进行切换。