jquery+css属性过滤选择

xiaoxiao2021-02-28  47

jquery+css属性过滤选择

当页面需要循环遍历出一个需求,假设是一个table的tr,由于是用循环遍历,我们不可能随意去给每个tr,td 的id,class或者其他属性取一个名字。这时可以利用实体类中的变化属性如id来给每个tr,td 的id,class或者其他属性取一个名字, 例如:div_实体类id, ‘div’仅仅是一个前缀名称,可任意取名; ‘_’用于分割,其他特殊字符也可以使用;

html:

@foreach (var s in Model.RoleList) { <tr> <td class="text-center"> <span id="sp_@s.id">@s.name</span> </td> <td class="text-center"> <span id="sp2_@s.id">@s.describe</span> </td> <td class="text-center"> <input type="button" class="btn btn-xs btn-info" id="editOnly_@s.id" value="编辑" style="display: inline-block;"> <input type="button" class="btn btn-xs btn-info" id="cancel_@s.id" value="取消" style="display: none;">  <input type="button" class="btn btn-xs btn-success" id="saveOnly_@s.id" value="保存" style="display: none;">  <input type="button" class="btn btn-xs btn-danger" id="del_@s.id" value="删除" style="display: inline-block;"> </td> </tr> }

js:

//选择所有id属性以'editOnly_'开头的input元素 $("input[id^='editOnly_']").click(function () { //获取id,并分割,num[1]便是分割出来的当前tr对应实体类id var num = $(this).attr("id").split("_"); $("#editOnly_" + num[1]).hide(); $("#sp_" + num[1]).hide(); $("#sp2_" + num[1]).hide(); $("#del_" + num[1]).hide(); $("#saveOnly_" + num[1]).show(); $("#cancel_" + num[1]).show(); $("#div_" + num[1]).show(); $("#div2_" + num[1]).show(); });
转载请注明原文地址: https://www.6miu.com/read-2628689.html

最新回复(0)