Javascript 自动更新输入字段的值

Javascript 自动更新输入字段的值,javascript,jquery,Javascript,Jquery,我不知道这个问题有多简单,也不知道有多复杂,因为我只是在学习javascript,但现在就开始了 假设我有一个输入字段: <input type="text" value=""/> 我试图编写一个javascript函数,每次输入空格时检查输入值,然后在用户键入时实时编辑该值 例如,假设我开始输入:你好,你好吗 在我点击“u”后面的空格后,我想用“you”替换“u” 那么,如果有人这么善良,我从哪里开始呢?这可能具有讽刺意味,因为我看到我正在键入的文本立即被更新到这个文本区域的

我不知道这个问题有多简单,也不知道有多复杂,因为我只是在学习javascript,但现在就开始了

假设我有一个输入字段:

<input type="text" value=""/>

我试图编写一个javascript函数,每次输入空格时检查输入值,然后在用户键入时实时编辑该值

例如,假设我开始输入:你好,你好吗

在我点击“u”后面的空格后,我想用“you”替换“u”

那么,如果有人这么善良,我从哪里开始呢?这可能具有讽刺意味,因为我看到我正在键入的文本立即被更新到这个文本区域的底部。然而,我正试图让它在该领域本身进行更新


谢谢

如果您正在使用jquery,请查看以下内容:


检测是否正在使用空格字符的好方法。

您不一定需要jQuery来完成这项工作,但使用vanilla JS需要更多的工作。首先,为您的输入提供一个ID:

<input id="ValueField" type="text" value="" />
检测变化的方法有一百万种,但首先想到的是函数:

var field = document.getElementById('ValueField');

field.addEventListener('keyup',function(e){
    if(e.keyCode==32){
        field.value = replaceValues(field.value);
    }
});

function replaceValues(fieldval){
    var baditems = [' u ',' i '],
        newitems = [' you ',' I '],
        length = baditems.length;

    for(var i = length; i--;){
        fieldval = fieldval.replace(baditems[i],newitems[i]);
    }

    return fieldval;
}
只需将坏的和新的项目的数组构建为与订单匹配相同的长度,您就应该是好的。这样,您可以替换任意数量的项目,并且应该运行得非常快

编辑


如果我让函数返回一些东西,可能会有所帮助!以身作则。另外,我必须在
u
I
周围添加空格,因为否则它将只匹配字母的任何实例。

看起来我必须开始学习jquery哈哈。这绝对是有用的。这里有很棒的信息。我会到处乱搞,看看能不能让它工作。非常感谢你!我似乎有代码工作,但我不断得到未定义的'u'和'I'值。是否可以用对象替换baditems和newitems?比如{u:'you'}或者类似的东西?哦,我只是个白痴,忘了包含函数返回(这是我动态编码而不是测试得到的)。编辑并包含jsFiddle.Ha,我也应该注意到这一点,尽管我对JS完全是新手。谢谢你的帮助,我无法想象我的问题会得到更好的答案!
var field = document.getElementById('ValueField');

field.addEventListener('keyup',function(e){
    if(e.keyCode==32){
        field.value = replaceValues(field.value);
    }
});

function replaceValues(fieldval){
    var baditems = [' u ',' i '],
        newitems = [' you ',' I '],
        length = baditems.length;

    for(var i = length; i--;){
        fieldval = fieldval.replace(baditems[i],newitems[i]);
    }

    return fieldval;
}