我可以看到一些其他问题，这些问题与我所需要的相似，但是它们并没有通过javascript实现，这正是我所需要的。
在一个坚果壳中，我使用ASP.Net Core来显示带有按钮链接旁边的值的表。当用户单击此按钮时，它将运行javascript，该javascript将其他字段追加到屏幕其他部分的表中。它还将按钮的（字体真棒）图像更改为另一图像。但是，如果用户随后单击另一个按钮，它将按预期工作（即，它在表中显示新数据并摆脱旧值，以及将btn-link更改为箭头中的新图像）。框），但我不知道如何将最初单击的按钮（或所有其他按钮）重置回原始图像（剪贴板）。我想我需要对第n个孩子做些事情，但我不确定。我看过not:nthchild(n)，但似乎没有用。
这是我的HTML代码：
<div class="card-body pl-0">
@*--------Specific Roles / TABLE--------*@
@foreach (var jobCat_Group in Model.RqmtData.SpecificRoles.GroupBy(specRoleType_Group => specRoleType_Group.SpecRoleType.JobCategory.JobCategory))
{
<table class="table lists-table py-0 border-0">
<tr class="py-0">
<td class="border-0 py-1 animate__animated animate__fadeInUp animate__delay-2s">
Working in <b>@jobCat_Group.Key</b>
</td>
</tr>
@foreach (var specRoleType_Group in jobCat_Group.GroupBy(specRole => specRole.SpecRoleType.SpecificRoleType))
{
<tr>
<td class="border-0 pb-1 pt-2 animate__animated animate__fadeInUp animate__delay-2s">
<h6>@Model.RqmtData.JobTitles.FirstOrDefault().Band.Band <span> | </span> @Model.RqmtData.JobTitles.FirstOrDefault().JobTitle | @specRoleType_Group.Key</h6>
</td>
@foreach (var specRole in specRoleType_Group)
{
@if ((specRole.SpecificRole == null) && ((specRole.SpecRoleM2mEnhApp.Count != 0) || (specRole.SpecRoleM2mQual.Count != 0) || (specRole.SpecRoleM2mSkill.Count != 0) || (specRole.SpecRoleM2mTraining.Count != 0) || (specRole.SpecRoleM2mCpd.Count != 0)))
{
<td class="border-0 animate__animated animate__fadeInLeft animate__delay-2s btn-link py-1" style="width: 1% !important;" data-id="@specRole.SpecificRoleId" id="appendRqmts">
<i class="fas fa-clipboard-list"></i>
</td>
}
}
</tr>
@foreach (var specRole in specRoleType_Group.Where(specRole => specRole.SpecificRole != null))
{
<tr>
<td class="border-0 py-1 animate__animated animate__fadeInUp animate__delay-2s">
@specRole.SpecificRole
@if (specRole.Remit != null)
{
<span> (</span>@specRole.Remit<span>)</span>
}
</td>
@if ((specRole.SpecRoleM2mEnhApp.Count != 0) || (specRole.SpecRoleM2mQual.Count != 0) || (specRole.SpecRoleM2mSkill.Count != 0) || (specRole.SpecRoleM2mTraining.Count != 0) || (specRole.SpecRoleM2mCpd.Count != 0))
{
<td class="border-0 animate__animated animate__fadeInLeft animate__delay-2s btn-link py-1" style="width: 1% !important;" data-id="@specRole.SpecificRoleId" id="appendRqmts">
<i class="fas fa-clipboard-list"></i>
</td>
}
</tr>
}
}
</table>
}
</div>
这里真正需要查看的唯一位是btn-link部分（但其余部分用于上下文）：
<td class="border-0 animate__animated animate__fadeInLeft animate__delay-2s btn-link py-1" style="width: 1% !important;" data-id="@specRole.SpecificRoleId" id="appendRqmts">
<i class="fas fa-clipboard-list"></i>
</td>
这是正在运行的javascript（其中不包括将所有其他btn链接重置为原始图像的位：
$(function () {
$('#appendRqmts:nth-child(n)').on('click', function () {
$('#specRolesTable_EnhAppRoute, #specRolesTable_Quals, #specRolesTable_Skills, #specRolesTable_Training, #specRolesTable_CPD').empty();
var url = "/api/SpecRolesViewData/";
var specRoleId = $(event.target).closest('td').data('id');
$(this).html('<i class="fas fa-sign-in-alt"></i>');
$.get(url + specRoleId, function (data) {
$.each(data, function (i, item) {
var tableParent;
var tableContent;
switch (item.rqmtTypeID) {
case 1:
tableParent = $('#specRolesTable_EnhAppRoute');
var isNullLevel = (item.rqmtLevel != null) ? '<span> | Level </span>' + item.rqmtLevel : '';
tableContent =
'<tr>'
+ '<td class="bg-light border-top border-bottom animate__animated animate__fadeInDown" style="width: 1% !important;">'
+ '<i class="fas fa-certificate"></i>'
+ '</td><td class="bg-light border-top">'
+ '</td><td class="bg-light border-top border-bottom animate__animated animate__fadeInDown">'
+ item.requirement
+ isNullLevel
+ '</td></tr>';
break;
case 2:
tableParent = $('#specRolesTable_Quals');
var isNullLevel = (item.rqmtLevel != null) ? '<span> | Level </span>' + item.rqmtLevel : '';
tableContent =
'<tr>'
+ '<td class="bg-light border-top border-bottom animate__animated animate__fadeInDown" style="width: 1% !important;">'
+ '<i class="fas fa-certificate"/>'
+ '</td><td class="bg-light border-top border-bottom animate__animated animate__fadeInDown">'
+ item.requirement
+ isNullLevel
+ '</td></tr>';
break;
case 3:
tableParent = $('#specRolesTable_Skills');
tableContent =
'<tr>'
+ '<td class="bg-light border-top border-bottom animate__animated animate__fadeInDown" style="width: 1% !important;">'
+ '<i class="far fa-check-circle"></i>'
+ '</td><td class="bg-light border-top border-bottom animate__animated animate__fadeInDown">'
+ item.requirement
+ '</td></tr>';
break;
case 4:
tableParent = $('#specRolesTable_Training');
var isNullLMSLink = (item.lmsLink != null) ? '<a href="' + item.lmsLink + '">' + item.requirement + '</a>' : item.requirement;
tableContent =
'<tr>'
+ '<td class="bg-light border-top border-bottom animate__animated animate__fadeInDown" style="width: 1% !important;">'
+ '<i class="far fa-caret-square-right"></i>'
+ '</td><td class="bg-light border-top border-bottom animate__animated animate__fadeInDown">'
+ isNullLMSLink
+ '</td></tr>';
break;
case 5:
tableParent = $('#specRolesTable_CPD');
var isNullLMSLink = (item.lmsLink != null) ? '<a href="' + item.lmsLink + '">' + item.requirement + '</a>' : item.requirement;
tableContent =
'<tr>'
+ '<td class="bg-light border-top border-bottom animate__animated animate__fadeInDown" style="width: 1% !important;">'
+ '<i class="far fa-caret-square-right"></i>'
+ '</td>'
+ '<td class="bg-light td-contents-text border-top border-bottom animate__animated animate__fadeInDown">'
+ isNullLMSLink
+ '</td>'
+ '<td class="td-contents-text bg-light border-top border-bottom w-25 animate__animated animate__fadeInDown">'
+ item.cpdType_Option
+ '</td>'
+ '</tr>';
break;
}
tableParent.append(tableContent);
});
});
});
}）;
与html / ASP一样，这里唯一需要关注的地方是$(this).html('<i class="fas fa-sign-in-alt"></i>');位，但我已将其全部添加为上下文。
（（注：一旦得到答案，我将删除不需要的部分代码，因为目前我可能会丢失一些内容-我还将展示所有有效解决方案的实现，如下我总是这样做。
所以，我的问题是...在改变页面上的其他元素之前，有没有办法将通过ASP.Net生成的列表中的所有其他按钮设置为使用Javascript的特定图像。 >
希望这很有意义，如果您需要进一步的澄清，请告诉我。如果需要，我可以做屏幕打印，但希望这将是一个简单的解决方法。我有点像JavaScript的菜鸟。
提前感谢！
我可以看到一些其他问题，这些问题与我所需要的相似，但它们不是通过javascript实现的，这正是我所需要的。简而言之，我使用ASP.Net Core来...
这里是演示.siblings()的示例。您想找到按钮单击的js函数，然后从那里可以访问this项目以更改单击的项目的图像...然后单击siblings()来设置其他图像。祝你好运