我基本上有多个div,其中包含不同单词(单词,定义等)的信息,全部在一个页面上。因此,每个“字牌”被写成如下(我拿出一些额外的东西):jQuery,使用自定义属性创建div的多个实例
<div id="card">
<div class="card-info-box" id="definition" wordID="1">To lessen or get rid of any pain or suffering.</div>
<a href="#" class="definition" wordID="1">Define</a>
</div>
我说“的wordID”的自定义属性,以每个单词。我正在尝试使用jQuery创建一个“Define”链接来切换相应的#definition div。到目前为止,我有以下的jQuery代码:
$(document).ready(function() {
$('#definition').hide();
$(".definition").click(function(evt) {
var d = $(this).attr("wordID");
$("#definition[wordID=" + d + "], #definition[wordID=" + d + "]").toggle();
});
});
与页面上只有一个一卡
现在,jQuery的正常工作与翻转它各自的定义格。但是,如果我复制了卡片div并在第二个集合上将wordID更改为2,则第二个div的定义链接不会执行任何操作。第一个仍然按照它的设想工作。
有什么我需要改变,以使jQuery的工作正常为每wordID的属性值?
谢谢!
完美的作品! 下面是一个演示,其他人都在想它会是什么样子。 http://jsfiddle.net/HVVgH/ 非常感谢! – Shiv
@Shiv很高兴帮助。你应该考虑改变ID卡'卡'类,不应该存在重复的ID。 – xdazz
是的,我现在要改变它...感谢通知! :) – Shiv