Javascript 禁止行插入|无jQuery

我有一张动态的桌子。数据来自“创建”按钮单击的输入。
若至少有一行包含当前输入ID字段值（尚未插入），则程序应禁止行插入。
我尝试添加checkId（）逻辑，但对我无效：

    checkId = () => {
    var isDuplicate = false;
    var idVal = inputs[0].value;

    if (textbox.value.includes(idVal)){
        isDuplicate = true;
        row.remove();
        alert("Pease, enter unique ID")

    }
    return isDuplicate;
}  

有没有办法在现有代码中实现这个逻辑（没有jQuery）

以下是html和js：

let headerArr=new Array（）；
headerArr=['ID'，'Fname'，'Lname'，'Age']；
//console.log（headerArr.length）
//投入
var div=document.getElementById（'enter'）；
var inputs=div.getElementsByTagName（'input'）
var计数=0；
createTable=（）=>{
让存储=document.createElement（'table'）；
storage.setAttribute（'id'，'storage'）；//设置表id
let row=storage.insertRow（-1）；
对于（设h=0；h{
var isDuplicate=假；
var idVal=输入[0]。值；
//textbox=document.createElement（'input'）
if（textbox.value.includes（idVal））{
isDuplicate=真；
row.remove（）；
警报（“请输入唯一ID”）
}
返回两份；
} */
//向表中添加新行
加数=（）=>{
let table=document.getElementById（'storage'）；
var rowCount=table.rows.length；//获取表格行数
var row=表.insertRow（行计数）
var文本框；
//如果（（！checkId（））&&rowCount>1）{
对于（设c=0；c


年龄：



创造
更新

您的条件无效，因为您试图从上下文中未定义的变量中获取.value

我修复了你的js代码：

       let headerArr = new Array();
    headerArr = ['ID', 'Fname', 'Lname', 'Age'];
    //console.log(headerArr.length)

    //inputs
    var div = document.getElementById('enter');
    var inputs = div.getElementsByTagName('input')
    var count = 0;

    createTable = () => {

        let storage = document.createElement('table');
        storage.setAttribute('id', 'storage'); //set the table ID

        let row = storage.insertRow(-1);

        for (let h = 0; h < headerArr.length; h++) { //table header
            let headCols = document.createElement('th');
            headCols.innerHTML = headerArr[h];
            row.appendChild(headCols);
        }

        let div = document.getElementById('dynamicTable');
        div.appendChild(storage); //add the table to the page
    }

    checkId = () => {

        var idVal = inputs[0].value;

        for (var i = 0; i < document.getElementsByClassName('id_cells').length; i++) {
            let el_id = document.getElementsByClassName('id_cells');
            if (el_id.value = idVal) {
                alert("Pease, enter unique ID");
                return true
            }

        }
        return false;

    }

    //add a new row to the table
    addEnd = () => {

        let table = document.getElementById('storage');

        var rowCount = table.rows.length; //get table row count
        var row = table.insertRow(rowCount)

        if ((!checkId()) && rowCount > 1) {
            for (let c = 0; c <= headerArr.length - 1; c++) {
                var cell = document.createElement('td');
                cell = row.insertCell(c);

                textbox = document.createElement('input');
                textbox.setAttribute('type', 'text');
                textbox.setAttribute('readonly', true);

                textbox.setAttribute('value', inputs[c].value);
                if (c == 0) {
                    textbox.setAttribute('class', 'id_cells');
                }
                cell.appendChild(textbox);

            }
        }
    }

    let createBtn = document.getElementById('create-btn');
    createBtn.addEventListener('click', addEnd, false);

let headerArr=new Array（）；
headerArr=['ID'，'Fname'，'Lname'，'Age']；
//console.log（headerArr.length）
//投入
var div=document.getElementById（'enter'）；
var inputs=div.getElementsByTagName（'input'）
var计数=0；
createTable=（）=>{
让存储=document.createElement（'table'）；
storage.setAttribute（'id'，'storage'）；//设置表id
let row=storage.insertRow（-1）；
对于（设h=0；h{
var idVal=输入[0]。值；
for（var i=0；i{
let table=document.getElementById（'storage'）；
var rowCount=table.rows.length；//获取表格行数
var row=表.insertRow（行计数）
如果（（！checkId（））&&rowCount>1）{
对于（设c=0；c
您的条件无效，因为您试图从上下文中未定义的变量中获取.value

我修复了你的js代码：

       let headerArr = new Array();
    headerArr = ['ID', 'Fname', 'Lname', 'Age'];
    //console.log(headerArr.length)

    //inputs
    var div = document.getElementById('enter');
    var inputs = div.getElementsByTagName('input')
    var count = 0;

    createTable = () => {

        let storage = document.createElement('table');
        storage.setAttribute('id', 'storage'); //set the table ID

        let row = storage.insertRow(-1);

        for (let h = 0; h < headerArr.length; h++) { //table header
            let headCols = document.createElement('th');
            headCols.innerHTML = headerArr[h];
            row.appendChild(headCols);
        }

        let div = document.getElementById('dynamicTable');
        div.appendChild(storage); //add the table to the page
    }

    checkId = () => {

        var idVal = inputs[0].value;

        for (var i = 0; i < document.getElementsByClassName('id_cells').length; i++) {
            let el_id = document.getElementsByClassName('id_cells');
            if (el_id.value = idVal) {
                alert("Pease, enter unique ID");
                return true
            }

        }
        return false;

    }

    //add a new row to the table
    addEnd = () => {

        let table = document.getElementById('storage');

        var rowCount = table.rows.length; //get table row count
        var row = table.insertRow(rowCount)

        if ((!checkId()) && rowCount > 1) {
            for (let c = 0; c <= headerArr.length - 1; c++) {
                var cell = document.createElement('td');
                cell = row.insertCell(c);

                textbox = document.createElement('input');
                textbox.setAttribute('type', 'text');
                textbox.setAttribute('readonly', true);

                textbox.setAttribute('value', inputs[c].value);
                if (c == 0) {
                    textbox.setAttribute('class', 'id_cells');
                }
                cell.appendChild(textbox);

            }
        }
    }

    let createBtn = document.getElementById('create-btn');
    createBtn.addEventListener('click', addEnd, false);

let headerArr=new Array（）；
headerArr=['ID'，'Fname'，'Lname'，'Age']；
//console.log（headerArr.length）
//投入
var div=document.getElementById（'enter'）；
var inputs=div.getElementsByTagName（'input'）
var计数=0；
createTable=（）=>{
让存储=document.createElement（'table'）；
storage.setAttribute（'id'，'storage'）；//设置表id
let row=storage.insertRow（-1）；
对于（设h=0；h{
var idVal=输入[0]。值；
for（var i=0；i{
let table=document.getElementById（'storage'）；
var rowCount=table.rows.length；//获取表格行数
var row=表.insertRow（行计数）
如果（（！checkId（））&&rowCount>1）{
对于（c=0；c）亚瑟·利格，谢谢！你建议的代码修改真的帮助了我避免了重复。亚瑟·利格，谢谢！你建议的代码修改真的帮助了我避免了重复。