如何在用户输入时直接更改输入框中的特定文本？答案

【问题标题】：How to Change Specific Text in an Inputbox Directly on User Input?如何在用户输入时直接更改输入框中的特定文本？
【发布时间】：2015-07-01 05:02:54
【问题描述】：

我的代码中有一个输入字段：<input type=text name=code id=code>。

我想做的是在用户在字段中键入时将特定文本转换为另一个文本。

让我再解释一下。当用户在输入中输入 31546 时，我希望该文本直接转换为 HELLO。

我知道这可以使用 JavaScript/jQuery 完成，但我对如何实现这一点没有任何想法。我该怎么办？

^{_{附注如果使用 textarea 更容易，我准备将输入更改为 textarea。}}

^_编辑：我从this StackOverflow post 得到一个代码，它检测到元素的任何更改，

 $('.myElements').each(function() {
   var elem = $(this);

   // Save current value of element
   elem.data('oldVal', elem.val());

   // Look for changes in the value
   elem.bind("propertychange change click keyup input paste", function(event){
      // If value has changed...
      if (elem.data('oldVal') != elem.val()) {
       // Updated stored value
       elem.data('oldVal', elem.val());

       // Do action
       ....
     }
   });
 });

但我不确定如何将其用于我想要的。

^{_{请多多包涵，因为我还是这个领域的新手。}}

谢谢。

【问题讨论】：

31546和HELLO是什么关系？
我想创建一个 MyCode 到英语的转换器。
这些之间有什么关系？您是否使用任何约定？
不是预先写好的。我正在做我自己的。 :)

标签： javascript text input

【解决方案1】：

一种选择是为您的输入设置一个 keyup 事件，然后在用户键入时替换该值。例如：

$('input').keyup(function () {
    var val = $(this).val();

    var newVal = val.split('31546').join('HELLO');

    if (newVal !== val) {
        $(this).val(newVal);
    }
});

【讨论】：

谢谢！这正是我想要的，而且效果很好。

【解决方案2】：

你可以使用 keyup 事件，

$(document).on('keyup', '#code', function() {
  $('#code').val(convertedValue($('#takeInput').val()));
})

function convertedValue(val) {
  return 'hello';
}

【讨论】：

感谢您的回答。您提供的代码在输入字段中的任何按键上将输入的数据更改为hello。
是的，您可以根据输入将转换后的值放在那里。

【解决方案3】：

这可能对你有帮助：--

   <input type="text" id="code">

    $('#code').bind('change click keyup onpaste', function(ele){
        var origVal = ele.target.value;
        if(origVal.indexOf("123") !== -1){
            ele.target.value = origVal.replace("123","Hello");
        }
    });

【讨论】：