在前两个td为空时将图标插入第三个td

Question

我需要jQuery的帮助，以便将两个图标插入 td id =“ person-action-{{person.id}}” 中，而另外两个具有相同 {{person .id}} 是空的fe

<td id="person-phone-{{ person.id }}"></td>
<td id="person-email-{{ person.id }}"></td>
<td id="person-action-{{ person.id }}"></td>

我刚刚编写了一些简单的代码。

    $(document).ready(function(){
        var emptyPhone = $('#person-phone-{{ person.id }}').is(':empty')
        var emptyEmail = $('#person-email-{{ person.id }}').is(':empty')
        $('#person-action-{{ person.id }}').each(function(){
            if (emptyPhone || emptyEmail ){
             // do something
            }
        });
    });

编辑： 感谢@wiertel的出色技巧，我进一步编写了代码，现在我想知道如何在此＃person-action中添加一些内容，在当前的tr中，电话和电子邮件单元格为空。我尝试使用下面的代码做一些事情：

    $(document).ready(_ => {
      $('#addressTab tbody tr').each((i, el) => {
        tr = $(el);
        id = tr.data('person-id');
        empty_phone = tr.find('#person-phone').is(':empty');
        empty_email = $('#person-email', tr).is(':empty');
        if (empty_phone && empty_email){
            $('#person-action').append("<i class='small material icons'>delete</i>");
        }
  });
});

实际结果： 预期结果：

Answer 1

您应该知道从模板生成的HTML的外观。我很确定执行JS代码时页面中没有{{ person.id }}片段。

您正在评估emptyPhone和emptyEmail一次，然后重用jQuery找到的每个元素的值。这不是你想要的。

我的建议是：

• 使用分配给<tr>所属的<td>的类，并在其中保存ID（<tr class="userInfoRow" data-user-id="{{person.id}}">）
• 这样，您将能够使用jQuery（$("tr.userInfoRow")）查找所有项目
• 找到它们后，对其进行迭代，提取用户ID，并分别检查每个项目