一键更改多个字形

Question

我正在使用 Bootstrap 字形作为文件夹树上多个节点的复选框。当单击该文件夹的复选框时，我需要切换给定文件夹的所有 glyphicon 复选框（但只有这个文件夹和只有复选框）。

<li data-layerid="Analises" data-grouped="group_Analises" class="parent_li">
  <span title="Collapse this branch"><i class="glyphicon glyphicon-file"></i> Analises</span>
  <i class="glyphicon glyphicon-unchecked" id="group_Analises" data-foldername="group_Analises"></i></li>

<li data-layerid="V%" data-grouped="2014">
  <span><i class="glyphicon glyphicon-file glyphicon-check"></i> V%</span>
  <i class="glyphicon glyphicon-check" id="2014" data-foldername="2014"></i> 
</li>
<li data-layerid="Ca" data-grouped="2014">
  <span><i class="glyphicon glyphicon-file glyphicon-check"></i> Ca</span>
  <i class="glyphicon glyphicon-check" id="2014" data-foldername="2014"></i> 
</li>

如果我这样做，我会更改页面上的所有字形。

$('i').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

如果我尝试直接访问 id，我只能更改具有此 id 的第一个元素，而不是所有元素：

$('#2014').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

非常欢迎提出建议。

Answer 1

尝试删除 DOM 上的 id 属性，改用 data-foldername 属性。

$('i[data-foldername="2014"]').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

一键更改多个字形

Change multiple glyphicons with one click

javascript

jquery

glyphicons