獲取錨元素的文本值

Question

這是我的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 %}

我想獲取帶有song_pk類的p元素內的文本值

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

這將打印一個隨機的長字符串。 如何獲得與單擊的按鈕關聯的文本的值？

Answer 1

利用prev()並嘗試：

function update(elem) {   // elem is an current element passed on the button click
     console.log($(elem).prev('.song_pk').text()); // will get previous p element text
 }

更新的小提琴演示

Answer 2

我的解決方案：

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

Answer 3

嘗試這個

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
 }

DEMO

Answer 4

看看最初發布的JSFiddle（ http://jsfiddle.net/d43Lr/4/ ）

合理的解決方案是使更新功能看起來像這樣

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

在原始函數中，您發現所有具有“ song_pk”類的元素-在這里，我們正在查看按鈕的同級。

（此處的演示： http : //jsfiddle.net/Q9H7T/ ）