Javascript 使用逗号自动格式化数字时，如何保持预期的光标位置？

我有一个输入，我想替换keyup事件中数字的值。使用

Intl.NumberFormat（）.format（num）以完成此操作

一切都很好，它工作得很好，直到你点击已经格式化的值的内部并开始添加更多的数字，光标就会跳起来

我试图通过设置光标来解决这个问题，但它仍然表现糟糕

简而言之，如何更改此代码段，以便无论在何处编辑值，光标都保持在预期位置


const input=document.getElementById（“foo”）；
input.addEventListener（“keyup”，handleKeyUp）；
功能handleKeyUp（e）{
const num=e.target.value.replace（/，/g，“”）；
const formatted=新的Intl.NumberFormat（）.format（num）；
var cursor=e.target.selectionStart；//+1；
input.value=格式化；
e、 target.setSelectionRange（光标，光标）；
}
//试试下面的方法
// 1) 123456789
// 2) 123
//3）将光标放在1和2之间并添加一个数字
//如果I++游标，则#1被解析
//和#2最初似乎已解决，除非我继续使用更多数字
这不是一个非常优雅的解决方案，但我根据文本字段中是否添加/删除了逗号（分别为左或右）来移动光标

请参阅下面的代码片段：


const input=document.getElementById（“foo”）；
input.addEventListener（“keyup”，handleKeyUp）；
让逗号=0；
功能handleKeyUp（e）{
const num=e.target.value.replace（/，/g，“”）；
const formatted=新的Intl.NumberFormat（）.format（num）；
//获取数字中的总逗号
设totalCommas=（格式化的.match（/，/g）| |[]）.length；
var cursor=e.target.selectionStart；
如果（逗号>总逗号）{
//将光标向左移动（删除了逗号）
逗号--；
光标--；
}else if（逗号<总逗号）{
//将光标向右移动（添加了逗号）
逗号++；
游标++；
}
input.value=格式化；
e、 target.setSelectionRange（光标，光标）；
}
//试试下面的方法
// 1) 123456789
// 2) 123
//3）将光标放在1和2之间并添加一个数字
//如果I++游标，则#1被解析
//和#2最初似乎已解决，除非我继续使用更多数字
这不是一个非常优雅的解决方案，但我根据文本字段中是否添加/删除了逗号（分别为左或右）来移动光标

请参阅下面的代码片段：


const input=document.getElementById（“foo”）；
input.addEventListener（“keyup”，handleKeyUp）；
让逗号=0；
功能handleKeyUp（e）{
const num=e.target.value.replace（/，/g，“”）；
const formatted=新的Intl.NumberFormat（）.format（num）；
//获取数字中的总逗号
设totalCommas=（格式化的.match（/，/g）| |[]）.length；
var cursor=e.target.selectionStart；
如果（逗号>总逗号）{
//将光标向左移动（删除了逗号）
逗号--；
光标--；
}else if（逗号<总逗号）{
//将光标向右移动（添加了逗号）
逗号++；
游标++；
}
input.value=格式化；
e、 target.setSelectionRange（光标，光标）；
}
//试试下面的方法
// 1) 123456789
// 2) 123
//3）将光标放在1和2之间并添加一个数字
//如果I++游标，则#1被解析
//和#2最初似乎已解决，除非我继续使用更多数字