jquery - 在用户输入期间将文本保留在 html 输入中

Question

我正在尝试在用户生成的文本后面附加“USD”作为 html 输入中的一个单元。现在我有一些 jquery，它在任何输入文本之前附加一个 $，然后在每个 keyup 上重建输入

   $('#pledge_amt_gross_total').on('keyup',function(){
      var text = this.value;
      $(this).val("");
      if (text.indexOf("$") == -1){
         text = "$ " +text;
       }
      $(this).val(text);

    }) 

这适用于用户输入文本之前 的任何内容，但是当我尝试在用户文本之后 附加任何内容时，它无法正常工作。

Answer 1

我制作了一个带有正则表达式的版本来查找输入中的数字并将其包装在您想要的内容中。我添加了一个超时以防止在用户完成输入之前移动光标。试试这个 fiddle

代码:

var formatTimeout;
$("#pledge_amt_gross_total").on("keyup", function() {
    var self = $(this);
    clearTimeout(formatTimeout);
    formatTimeout = setTimeout(function() {
        var regex = /\d+/;
        var amount = self.val().match(regex);
        if (amount.length > 0) {
         self.val("$ " + amount + " USD");   
        } else {
              self.val("");       
        }   
    }, 1000);
});

如果您希望它更快或更慢，您可以在 setTimout 函数中更改应用格式之前的时间。

---

编辑:

如果您希望任何数字以以下格式连接:fiddle

var formatTimeout;
$("#pledge_amt_gross_total").on("keyup", function() {
    var self = $(this);
    clearTimeout(formatTimeout);
    formatTimeout = setTimeout(function() {
        var regex = /\d+/g;
        var amount = self.val().match(regex);
        if (amount.length > 0) {
         self.val("$ " + amount.join("") + " USD");   
        } else {
              self.val("");       
        }   
    }, 1000);
});

我将正则表达式替换为可以找到任何数字的全局正则表达式。然后我将数字合二为一。