根据数据属性而不是类查找元素. - 轨道

Question

我目前有这个设置。

对于 HTML：

<%= select_tag "Groups", options_from_collection_for_select(@groups, "id", "name", params[:filter]),
class: "filter-groups",
prompt: "All Groups"
%>

对于 jquery：

$(document).on('ready page:load', function() {
$('.filter-groups').on('change', function() {
window.location.replace('/people?filter='+this.value);
});
});

所以，现在我正在使用一个类来查找元素。但是我想改为使用数据属性。谁能帮我解决这个问题？仅供参考，我根本不需要该类，因此我想完全删除数据属性的该类。

Answer 1

一般来说，使用类从 javascript 中查找页面上的元素是一种不好的做法，所以你想要把它更改为data-属性是对的。 请使用以下内容：

<%= select_tag "Groups", options_from_collection_for_select(@groups, "id", "name", params[:filter]),
data: { filter_groups: '' },
prompt: 'All Groups'
%>

这将生成以下 HTML 代码：

<select name="Groups" id="Groups" class="filter-groups" data-filter-groups="">

在jQuery中，你可以使用：

$('[data-filter-groups]').on('change', ...)

边栏将自动将下划线替换为短划线。

如果有帮助，另请阅读以下内容：https://medium.com/@coorasse/how-to-access-your-dom-from-javascript-77faa762c288