Javascript 检查团队是否已添加

我有一个页面，你可以邀请团队。单击“邀请团队”会出现一个弹出框，显示搜索输入。搜索功能是基于AJAX的。当通过您的搜索词找到团队时，您必须单击该团队，然后该团队将显示在“邀请的团队”框中

它的工作方式是，当您“添加”团队时，将生成一个隐藏的输入字段，其中包含作为值的团队ID。问题是，使用我当前的代码，可以根据需要多次添加相同的团队。我应该可以检查，如果团队可以在隐藏的输入数据中找到。如果已经存在，则不可能添加sane团队

我当前的javascript代码可以在下面找到。请注意，我已经尝试生成检查团队的代码，但它不起作用

function addTeam(tid) {
    // Grab the input value
    var teamName = document.getElementById(tid).innerHTML;
    var teamID = document.getElementById(tid).id;

    // If empty value
    if(!teamName || !teamID) {
        alert('An error occured.');
    } else {
        //Tried to do the "team-adlready-added"-test, but it doesn't work
        var stored_teams = $t('#store-teams').getElementsByTagName('input');
        for (var i = 0; i < stored_teams.length; i++) {
            var stored_team = stored_teams[i];
            if(stored_team.value == teamID) {
                break;
                var team_already_added = 1;
            }
            alert(team_already_added);
        }
        if((team_already_added) || team_already_added != 1) {
            // Store the team's ID in hidden inputs
            var store_team = document.createElement('input');
            store_team.type = 'hidden';
            store_team.value = teamID;

            // Append it and attach the event (via onclick)
            $t('#store-teams').appendChild(store_team);             

            // Create the teams with the value as innerHTML
            var div = document.createElement('div');
            div.className = 'team-to-invite';
            div.innerHTML = teamName;

            // Append it and attach the event (via onclick)
            $t('#teams').appendChild(div);
        }
        div.onclick = removeTeam;
    }
    return false;
}

功能添加团队（tid）{
//获取输入值
var teamName=document.getElementById（tid）.innerHTML；
var teamID=document.getElementById（tid.id）；
//如果为空值
如果（！teamName | |！teamID）{
警报（'发生错误'）；
}否则{
//尝试进行“team adlready added”-测试，但不起作用
var storaged_teams=$t（“#存储团队”）.getElementsByTagName（'input'）；
对于（变量i=0；i

---

提前谢谢

您的变量范围已关闭。 您声明团队已添加到错误的位置。

---

用团队名称和团队id声明它，它将使您朝着正确的方向前进

我只想给您一个提示，告诉您一个不使用html元素的可能解决方案

您可以为团队创建新的功能对象：

var Team = function (id, name) {
    this.name = name;
    this.id = id;
}

创建一个包含团队的数组：

var TeamList = [];

添加您的团队：

TeamList.push(new Team(1, "Team 1"));
TeamList.push(new Team(2, "Team 2"));
TeamList.push(new Team(3, "Team 3"));
TeamList.push(new Team(4, "Team 4"));

编写一个函数，在团队列表中循环，并使用id检查团队是否已经存在：

function containsTeam(id) {
    for (var i = 0; i < TeamList.length; i++) {
        if (TeamList[i].id == id) {
            return true;
        }
    }
    return false;
}

查看并打开控制台以查看输出

编辑：此外，要删除元素，您可以编写一个与containsTeam函数几乎相同的函数。只需使用array.splice而不是返回true：

function removeTeam(id) {
    for (var i = 0; i < TeamList.length; i++) {
        if (TeamList[i].id == id) {
            TeamList.splice(i, 1);
        }
    }
}

---

为什么不是数组而不是元素？什么是

$t

？某种选择器框架？@BrianHannay数组应该是什么样子？请容忍我，我是这个领域（javascript）的初学者。@MarcelGwerder$t只是一个queryselector:var$t=function（selector）{returndocument.queryselector（selector）；}；您是否尝试过任何类型的调试，例如firebug？我应该在何处声明团队已添加？为什么要同时声明团队名称和团队ID？非常感谢！这很有道理，然后我就可以去掉HTML元素了。如何将团队从团队列表阵列中移除？作为一种魅力-添加/检查/移除部分！你能告诉我，为什么我不能将这个移除事件添加到团队邀请div:div.onclick='removeTeam（'+teamID+'）；这是在什么上下文中，为什么在

removeTeam

周围使用引号？请参见此处更新的代码：我仍然需要为所选团队创建HTML元素。这将为用户提供全面的视图。但是，当团队被添加并显示在“team added”（团队添加）框下时，用户应该能够通过一次单击删除该团队。这就是onclick事件的必要之处。还是我误解了什么？确实如此！无法告诉你我有多伟大。非常感谢你的帮助，这解决了我的问题。此外，它告诉我关于数组而不是HTML元素。祝您有个美好的一天！

function removeTeam(id) {
    for (var i = 0; i < TeamList.length; i++) {
        if (TeamList[i].id == id) {
            TeamList.splice(i, 1);
        }
    }
}

removeTeam(3);