javascript – 一个Jquery点击函数用于乘法div

试图为我的所有div框使用一个单击功能.做了一些研究,但仍然无法使其正常工作.我是编程的新手,所以我可能会以错误的方式解决这个问题,这里是我正在尝试做的一个例子:

<div id="test_1">
  <p class="example">display this text 1</p>
</div>

<div id="test_2">
  <p class="example">display this text 2</p>
</div>

<div id="test_3">
  <p class="example">display this text 3</p>
</div>
$('div[id^="test"]').each(function(){
    $(this).click(function(){
        test = $(this).parent().find('.example').attr("p")
        alert(test)
    })
})

我认为这会有效,但是如果我点击div test 2或3,警报显示“显示此文本1”而不是“显示此文本2”或“… 3”.

知道我做错了什么吗?

最佳答案
删除.parent().否则,您将获得所有嵌套的.example元素,并检索第一个元素的.attr(‘p’).

$('div[id^="test"]').each(function(){
    $(this).click(function(){
        var test = $(this).find('.example').attr("p")
        alert(test)
    })
})

或缩短如下:

$('div[id^="test"]').click(function(){
    var test = $(this).find('.example').attr("p")
    alert(test)
})

您的问题表明您获得了正确的文本结果,但您的代码显示的是.attr(“p”),但不会.我保持代码示例保持不变的方式.

转载注明原文:javascript – 一个Jquery点击函数用于乘法div - 代码日志