Javascript在同一函数中获取文本框的值

当我使用单个函数通过使用for循环创建多个html表格行时，我在每一行中都创建了一个文本框和一个按钮。Javascript在同一函数中获取文本框的值

我没有做的是当用户点击按钮时，它会得到文本框的值（在同一行内）。我得到的错误：遗漏的类型错误：不能为空的读取属性“价值”

请检查下面bidbtn.onclick =（）函数部分：

function tablelisting(){ 
    for(i=0;i<domainarray.length;i++){ 
     var newtr = document.createElement("tr") 
     var newtd1 = document.createElement("td") 
     var newtd2 = document.createElement("td") 
     var newtd3 = document.createElement("td") 
     var newtd4 = document.createElement("td") 
     var newtd5 = document.createElement("td") 
     var bidbtn = document.createElement("button") 
     var textbox = document.createElement("input") 

     bidbtn.innerHTML = "Bid" 
     bidbtn.setAttribute("class","btn1") 
     //bidbtn.setAttribute("onclick","bid()") 

     textbox.setAttribute("type","text") 
     textbox.setAttribute("placeholder","USD") 
     textbox.setAttribute("class","bidtextbox") 
     textbox.setAttribute("id","bidinput"+i) 

     newtr.appendChild(newtd1) 
     newtd1.innerHTML = domainarray[i].domain 
     newtr.appendChild(newtd2) 
     newtd2.innerHTML = domainarray[i].dtcreate 
     newtr.appendChild(newtd3) 
     newtd3.innerHTML = domainarray[i].dtexpire 
     newtr.appendChild(newtd4) 
     newtd4.innerHTML = (Date.parse(domainarray[i].dtexpire) - Date.parse(formatDate(new Date())))/86400000 + " days" 
     newtr.appendChild(newtd5) 
     newtd5.appendChild(textbox) 
     newtd5.appendChild(bidbtn) 

     bidbtn.onclick = function(){ 
      var bidamount = document.getElementById("bidinput"+i).value 
      console.log(bidamount) 
     } 

     domtable.appendChild(newtr) 
    } 
}

我知道每个bidbtn搭配与文本框在同一行内，但我不知道如何获得用户填写金额后点击文本框的价值，然后点击bidbtn。

如何使bidamount =用户填入金额后的文本框的值？

来源

2017-10-19 Jerry

PLZ使代码段。它会帮助很多 –

什么是'domainarray'和'domtable'。您正在脚本中使用它们，但它们没有在任何地方定义。 – tommyO

您不能像这样使用i，因为它在循环的每次迭代中都会更改。当点击处理程序触发时，它始终是最后一次迭代的值，因此点击处理程序将无法按预期工作。要解决此问题，使用方法：

domarray.forEach(function (elm, index) { 
    // ... 
});

您可以在docs阅读更多关于Array.prototype.forEach()。

现在，万一你意识到domarray不是一个真正的数组，但像一个节点列表，这里是如何做forEach()在这种情况下。

[].forEach.call(domarray, function (elm, index) { 
    // ... 
});

来源

2017-10-19 17:58:39 hayavuk

可能的解决方法：获取按钮父 - >表格单元格，得到行，找到.bidtextbox类元件，得到值


bidbtn.onclick = function(){ 
    var bidamount = this.parentElement.parentElement.querySelector(".bidtextbox").value; 
    console.log(bidamount); 
}

来源

2017-10-19 18:27:42

实测溶液：

1）创建的onclick = “出价（在这里传递行号）”，并为每一行按钮设置一个id。

function tablelisting(){ 
    for(i=0;i<domainarray.length;i++){ 
     var newtr = document.createElement("tr") 
     var newtd1 = document.createElement("td") 
     var newtd5 = document.createElement("td") 

     var bidbtn = document.createElement("button") 
     var textbox = document.createElement("input") 

     bidbtn.innerHTML = "Bid" 
     bidbtn.setAttribute("class","btn1") 
     bidbtn.setAttribute("onclick","bid("+i+")") 
     bidbtn.setAttribute("id","btn"+i) 


     newtr.appendChild(newtd1) 
     newtd1.innerHTML = domainarray[i].domain 

     newtr.appendChild(newtd5) 
     newtd5.appendChild(textbox) 
     newtd5.appendChild(bidbtn) 



     domtable.appendChild(newtr) 
    } 
}

2）创建报价函数来获取行号，然后得到父母的子元素值：

function bid (b){ 
    var bidamount = document.getElementById("btn"+b).parentElement.firstChild.value; 

}

来源

2017-10-22 12:03:14 Jerry

Javascript在同一函数中获取文本框的值

回答

相关问题