Javascript 获取锚元素的文本值

这是我的HTML

{% for song in dj_song_list %}
        <div>
            <p><h3>{{ song.name }}</h3></p>
            <p style="display:none;" class="song_pk">{{ song.id }}</p>
            <button type="button" class='vote' onclick="update(this);">Vote as Favourite</button>
        </div>
{% endfor %}

这将打印一个随机的长字符串。如何获取与我单击的按钮关联的文本值？

我的解决方案：

  function update(item) {
        var text = $(item).parent().find('p.song_pk').text();
        //or
        var text2 = $(item).prev().text();
  };

利用并尝试：

试试这个

function update(e) {
     console.log($(e).prev('.song_pk').text());//It print clicked element prev p text
     console.log($(e).text());//It print clicked element text
 }

---

查看原始发布的JSFIDLE（）

一个合理的解决方案是让update函数看起来像这样

function update(element) {
     console.log($(element).siblings('.song_pk').text());
}

在最初的函数中，您找到了所有具有“song_pk”类的元素-这里，我们查看按钮的兄弟

---

（此处演示：）

Works在此处不起作用-而是打印所有组合的文本字符串。我已经用你的小提琴更新了我的答案。checkthefiddle似乎在工作，但出于某种原因，它在我的代码中不起作用，即使我的函数完全相同。它只返回一个空白字符串。关于可能发生的事情有什么线索吗？您的

标记是否包含值？我是说有文本吗？您可能会得到

{{song.id}}

空白，song.id应该是空白的

function update(e) {
     console.log($(e).prev('.song_pk').text());//It print clicked element prev p text
     console.log($(e).text());//It print clicked element text
 }

function update(element) {
     console.log($(element).siblings('.song_pk').text());
}