我的UI上有一些输入字段和一个HTML表，用于输入一些数据，HTML表中的HTML表中有一些输入字段，并且进行一些计算也可以正常工作
我正在做的是：
我的表格中有一些输入字段，所以当我按下选项卡时，我将聚焦于下一个输入字段
现在，在按Disc%后，这里是最后一个输入字段，它是tab我正在创建新行（焦点突出），但这不是一个好的用户界面，因为每当我在Disc%字段外单击时，它都会创建新行不正确的行
我正在尝试做的是：
在disc%之后，当我按Enter时，我想创建一个新行，以便对用户有利
我尝试这样做，但是它无法正常工作，因为当我到达Disc%并按Enter时，它什么也没有做；当我集中注意力并再次回到Disc%并按Enter时，它会创建新行，但一按就可以放映三遍，我不知道怎么了
请check my Fiddle，因为我有很多计算，这就是为什么代码有点长的原因，但是我已经注释了问题所在的行
当目标匹配光盘％时，我正在执行以下操作
if (e.target.matches('[name=discPercentagetd]')) {
$(document).keypress(function(event) { // here I am trying to create new row when enter is clicked
var keycode = event.keyCode || event.which;
if (keycode == '13') {
alert("presed")
calcDiscount(e.target.parentElement.parentElement)
if ($(row).parent().find('tr').length - $(row).index() === 1) {
rowappend(e.target.parentElement.parentElement.parentElement)
}
}
});
}
我这样做就像
$(document).on('focusout', (e) => {，因为表中的ItemName字段是autoComplete，并且在创建新行时，我希望它的行为与上述相同。 最佳答案
您需要做的是将按键功能移出现有的对焦功能。 JSFiddle
因为您正在检查它们是否已在聚焦功能内按回车键，所以它的行为不符合您的预期。
将其移出该函数之外后，其行为将与预期的一样，警报仅触发一次，并且即使焦点仍位于输入元素内，也会创建该行。
$(document).on('focusout', (e) => {
const row = e.target.parentElement.parentElement
if (e.target.matches("[name=itemNametd]")) { // whene focus is out from itemNametd
getValues(e.target.parentElement.parentElement)
}
if (e.target.matches('[name=unitQtytd]')) { //when focus is out from unitQty
calc(e.target.parentElement.parentElement)
}
});
// Move this outside of the above focusout function,
// you will also need to rename all of the e elements to event,
// or the other way around. Also include line where you declare the row variable
$(document).keypress(function(event) {
const row = event.target.parentElement.parentElement
var keycode = event.keyCode || event.which;
if (keycode == '13') {
alert("presed")
calcDiscount(event.target.parentElement.parentElement)
if ($(row).parent().find('tr').length - $(row).index() === 1) {
rowappend(event.target.parentElement.parentElement.parentElement)
}
}
});与问题无关（因为您在谈论用户体验）：
要记住的一件事是“用户将如何知道按回车键来创建新行”。最好还包括一个添加行的按钮，以及一个小元素，它可以显示有关悬停的更多信息，从而说明他们可以使用enter来创建新行。
另外，考虑对总行进行样式设置，使其看起来像是表格的一部分，这样用户就可以知道数字匹配的内容。