Question

我遇到了在foreach迭代中循环遍历元素然后从元素中提取首字母缩略词的挑战，然后将另一个元素的值设置为派生的首字母缩略词。

这是我的代码

1）cshtml：

foreach (var item in Model)
{                
     <h3 class="getName">@item.FullName</h3>
     [...]
     <h4 class="displayAvatar"></h4>
     [...]
}

2）Jquery代码：

$('.getName').each(function (e) {
        var techieFullName = $('.getName').text();
        var getNameAcronym = techieFullName.match(/\b(\w)/g);
        var theName = getNameAcronym.join('');
        $('.displayAvatar').text(theName);
});

上面的代码将相同的结果（派生的首字母缩略词）分配给具有“displayAvatar”类的所有h4元素，但我希望每个fullname都设置为每个首字母缩略词

我如何让它运行起来？欣赏

Answer 1

因为您使用了forEach循环。如果您在div说eachRow中包含多个标题标记，则会更容易。脚本在下面提供，直截了当。

<强> CSHTML：

foreach (var item in Model)
{     
   <div class="eachRow">           
     <h3 class="getName">@item.FullName</h3>
     <h4 class="displayAvatar"></h4>
   </div>
}

<强> JQUERY：

$('.getName').each(function (e) {
        var techieFullName = $(this).text();
        var getNameAcronym = techieFullName.match(/\b(\w)/g);
        var theName = getNameAcronym.join('');
        $(this).closest('.eachRow').find('.displayAvatar').text(theName);
});

修改使用管道衬里减少许多局部变量的使用。

$('.getName').each(function (e) { var result= $(this).text().match(/\b(\w)/g).join(''); $(this).closest('.eachRow').find('.displayAvatar').text(result); });

Answer 2

您可以使用.next()来获得课程displayAvatar的紧随其后的兄弟：

$('.getName').each(function (e) {
    var techieFullName = $(this).text();
    var getNameAcronym = techieFullName.match(/\b(\w)/g);
    var theName = getNameAcronym.join('');
    $(this).next(".displayAvatar").text(theName);
});

循环遍历foreach循环中的元素并从值中提取首字母缩写词，然后将另一个元素的值设置为派生的首字母缩略词

2 个答案: