Javascript HTML：从没有ID的输入中获取值

一直在四处寻找，我似乎找不到答案，所以也许我的措辞是错误的，但它来了

所以我有一个表显示数据库中的数据。在jQuery中，我这样做是为了添加一行空输入，然后将其提交到数据库，这样做很好

我现在正试图编辑它。因此，每行都有一个按钮来编辑该行，该按钮将把行值放入输入中，以便您可以更改值并更新数据库。我该怎么做？我正在研究如何使用输入框，但我不确定如何在输入框没有某种ID的情况下获取它们的值

我尝试使用的jQuery：

$（'#tbl'）。在（'click'，'.xx'，function（）上{
$（this）.兄弟姐妹（）。每个(
函数（）{
if（$（this）.find（'input'）.length）{
$（this）.text（$（this.find（'input'）.val（））；
}
否则{
var t=$（this.text（）；
$（this.text（“”）.append（$（“”，{'value'：t}）.val（t））；
}
});
});

我是不是想得太多了？我是否应该抓取这些值，然后将它们放入预先制作的输入框中

更新： HTML:

sb.AppendLine("<table style='width: 80%;'>")
sb.AppendLine("<tr class='inputRowbelow'>")
sb.AppendLine("<td style='width: 20%;' class='ui-widget-header ui-corner-all'>Area</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Details</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Options</td>")
sb.AppendLine("</tr>")

For Each w In workItems
    sb.AppendLine("<tr>")
    sb.AppendLine("<td>" & w.area & "</td>")
    sb.AppendLine("<td>" & w.details & "</td>")
    sb.AppendLine("<td><a href='#' class='fg-button ui-state-default ui-corner-all edit'><img src='/images/spacer.gif' class='ui-icon ui-icon-pencil' /></a></td>")
    sb.AppendLine("</tr>")
Next

sb.AppendLine("</table>")

sb.AppendLine（“”）
某人加上一行（“”）
某人在某一行（“区域”）
某人附文（“细节”）
sb.附录行（“选项”）
某人加上一行（“”）
对于工作项中的每个w
某人加上一行（“”）
sb.追加行（“&w.area&”）
sb.追加行（“&w.details&”）
某人加上一行（“”）
某人加上一行（“”）
下一个
某人加上一行（“”）

而不是对每个。。。在里面接下来，使用带有计数器的For循环。给每一个按钮和每一行一个ID，最后是当前计数器值。然后可以使用Jquery使每一行分别可编辑，因为每一行现在都有一个行号。

有几种方法可以做到这一点，包括更改VB代码以向html添加额外数据，但我将从纯javascript/Jquery解决方案中回答这一问题

首先，您需要处理每个编辑按钮的单击事件，然后找到匹配的行，然后您可以获得该行的第一个元素

$(".edit").click(function(e){
    e.preventDefault();//prevent the link from navigating the page
    var button = $(this);//get the button element
    var row = button.closest("tr");//get the row that the button belongs to
    var cellArea = row.find("td:eq(0)");//get the first cell (area)
    var cellDetails = row.find("td:eq(1)");//get the second cell (details)

    //now you can change these to your inputs and process who you want
    //something like this...
    ConvertToInput(cellArea, "area");
    ConvertToInput(cellDetails, "details");
});

function ConvertToInput(element, newId){
    var input = $("<input/>");//create a new input element
    input.attr("id", newId);//set an id so we can find it
    var val = element.html();//get the current value of the cell
    input.val(val);//set the input value to match the existing cell
    element.html(input);//change the cell content to the new input element
}

$（“.edit”）。单击（函数（e）{
e、 preventDefault（）；//阻止链接导航页面
var button=$（this）；//获取button元素
var row=button.closest（“tr”）；//获取按钮所属的行
var=row.find（“td:eq（0）”；//获取第一个单元格（区域）
var cellDetails=row.find（“td:eq（1）”；//获取第二个单元格（详细信息）
//现在，您可以将这些更改为您的输入并处理您想要的人
//像这样的。。。
转换输入（区域）；
转换输入（单元格详细信息，“详细信息”）；
});
函数ConvertToInput（元素，newId）{
var input=$（“”）；//创建一个新的输入元素
input.attr（“id”，newId）；//设置一个id以便我们可以找到它
var val=element.html（）；//获取单元格的当前值
input.val（val）；//设置输入值以匹配现有单元格
html（input）；//将单元格内容更改为新的输入元素
}

---

然后，您可以使用每个字段的ID值执行您所说的已实现的保存操作，以获取要保存的值。

使用JQuery查找DOM元素有很多方法，您可以发布html以便我们提供建议吗some@musefan我不知道你想要什么，这只是一张标准的桌子。如果你真的想，我可以更新它，但任何和所有的方式将很高兴看到。我想看看你的表格，我想看看每一行的编辑按钮与该行其余部分的关系。有很多方法可以从头开始开发类似的东西，但是这个问题是关于回答您的特定实例的。@musefan我已经用我正在使用的表更新了这些问题。这都是在StringBuilder中完成的。好的，只查看HTML输出会更容易，但这样就可以了。因此，您想获得与编辑按钮匹配的行的区域和详细信息的

td

元素吗？我以前确实考虑过这一点，但我觉得应该有更好的方法来实现这一点。谢谢你的回答。非常好，为我工作，谢谢你的解释+1和正确答案。干得好。快速提问，如果你点击多个按钮，它会用输入标签填充输入。。我们怎样才能阻止这一切？（除了移除/隐藏按钮外）@Ruddy：你可以有某种

isEdit

标志，但我还是建议隐藏按钮，或者用“保存”按钮替换它