javascript - 如何将 jQuery 数据变量放入按钮而不是 div 中

Question

我有一个使用 jquery 的 Rails 站点。我正在将“关注”按钮从用户页面移至搜索显示页面。

这意味着我必须将 javascript 从假设每个页面上只有一个关注按钮的 javascript 更改为可与页面上的许多关注按钮配合使用的 javascript。这些按钮中的每一个都针对搜索结果中的不同用户。

我的旧代码是这样工作的:

HTML:

= content_tag 'div', id: 'friends-data', data: {user_id: current_user.id, friend_id: user.id, is_following: true } do
= button_tag "Follow", class: 'btn btn-Follow followUser'

HTML(已编译):

<div id="friends-data" data-user-id="2" data-friend-id="8" data-is-following="true"></div>
<button name="button" type="submit" class="btn btn-follow followUser">Follow</button>

JS:

this.data = $('#friends-data').data();

我希望按钮有自己的数据。这样我的 this.data 就已经是数据了，我不必从上面的 div 中获取它。这样JS就不会总是抓取第一个用户的数据，但它会抓取与该按钮关联的用户的数据。

我的问题是 this.data = $(this).data(); 不起作用。

例如给定:

<div id="friends-data" data-user-id="2" data-friend-id="8" data-is-following="true"></div>
<button name="button" type="submit" class="btn btn-follow followUser" data-user-id="2" data-friend-id="8" data-is-following="true">Follow</button>

和

$(document).ready(function(){
    $(".followUser").click(function(){
    window.alert($('#friends-data').data());
    window.alert(this.data());
  });
});

这会打印第一个警报，但不会打印第二个警报。

Answer 1

更改此:

window.alert(this.data());

这样:

window.alert($(this).data());