在表单域自动改变值(Automatically change a value in a form f

我有一个网页，人们输入信息（姓名，职务，地址等），并自动为他们创建一个名片。 目前，我有一些jQuery的使用.change，并期待在现场，当用户改变它。

它看起来与他们进入什么问题，因为有些东西必须是在一定的格式（EX-他们输入单词“大道”，它不会让他们的项目添加到他们的购物车，直到他们将其更改为大道）

我试图找到某种方式来做到这一点上飞与JS / jQuery的自动完成，但我不知道该怎么做。 我想是该领域进行自我更新，因此，如果用户将在“大道”它会自动更新到“大道” 用户的标签后/退出字段。

什么JS和/或jQuery的可以用来做任何想法？

这里是我当前的代码：

 var x = "Clean";
 var xD = " ";
 $('#cartText4046').change(function () {
        if ($(this).val().indexOf("Avenue") > -1) {
            x = "Please use Ave. instead of Avenue.";
        } else if ($(this).val().indexOf("avenue") > -1) {
            x = "Please use Ave. instead of Avenue.";
        ... Additional rules here, omitted for space.
        } else {
           x = "Clean";
        }


    if (x != "Clean") {
        $('#cartText4046').addClass("invalid");
        xD = x;
     } else if (x == "Clean") {
        $('#cartText4046').removeClass("invalid");
        xD = " ";
    }

     if (x != "Clean") {
        $('.betabutton').html('<span id="addToBaskettext">To add this to the Basket, 
         please fix the following issue(s):<br><br>&nbsp;' +xD'</span>');
        $('.betabutton').addClass("invalidBtn");
     } else if (x == "Clean") {
        $('.betabutton').html('<a id="addToBasket" href="#" onclick="actionPageSubmit();return false;"><span id="addToBaskettext">Add to Basket</span></a>');
        $('.betabutton').removeClass("invalidBtn");
    }

Answer 1:

以下是你可能会寻找工作示例。

$("#textbox").on("change", function() {
    $(this).val(function(index, value) {
        return value.replace('Avenue', 'Ave.');
    });
});

http://jsfiddle.net/decx8sw9/

Answer 2:

如果你真的希望它的用户后做它已经完成更改（“用户的标签后/退出的领域。”），你可能要绑定到模糊（火灾丢失焦点时/转移到一些其他的元素）.. 。

$('#cartText4046').on( "blur", function() {
$(this).val(function(index, value) {
    value = value.replace('Avenue', 'Ave.');
    // keep going ... value = value.replace('Street', 'St.') ..
    return value;
});

Answer 3:

编辑：我重读的问题，现在看到你想要的校正的用户退出后场的情况发生。 这个答案提供了在用户类型在线自动更正。 我将它留在情况下，你觉得毕竟它是有用的。

您可以从提升代码的jQuery插件自动更正 ： 的jsfiddle 。

$("#textbox").autocorrect({
    corrections: {
        Avenue: "Ave.",
        "...": "someWord"
    }
});

文章来源: Automatically change a value in a form field