自动更改表单字段中的值 [英] Automatically change a value in a form field

问题描述

我有一个人们输入信息的网页（姓名，职位，地址等），并自动为他们创建名片。我目前有一些jQuery使用.change，并在用户更改它时查看字段。

它会查找他们输入的内容，因为有些内容必须采用特定的格式（前 - 输入Avenue一词并且不会让他们将项目添加到他们的购物车，直到他们改变为Ave。）

我试图找到一些方法来使用JS / jQuery自动执行此操作，但是我我不知道该怎么做。我希望这个领域能够自我更新，所以如果用户放入大道，它会自动更新为Ave.。

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

以下是我目前的代码：

  var x =Clean; 
 var xD =& nbsp;; 
 $（'＃cartText4046'）。change（function（）{
 if（$（this）.val（）。indexOf（Avenue）> -1）{
x = 请使用Ave.而不是Avenue。; 
} else if（$（this）.val（）。indexOf（avenue）> -1）{
x =请使用Ave.而不是Avenue。; 
 ...此处的其他规则，省略空间
} else {
x =Clean; 
} 
 
 
 if（x！=Clean）{
 $（'＃cartText4046'）。addClass（invalid）; 
 xD = x; 
} else if（x ==Clean）{
 $（'＃cartText4046'）。removeClass（invalid）; 
 xD =& nbsp;; 
} 
 
 if（x！=Clean）{
 $（'。betabutton'）。html（'< span id =addToBaskettext>要添加到篮子中，
请修复以下问题：< br>< br>& nbsp;'+ xD'< / span>'）; 
 $（'。betabutton'）。addClass（invalidBtn）; 
} else if（x ==Clean）{
 $（'。betabutton'）。html（'< a id =addToBaskethref =＃onclick =actionPageSubmit（）; return false;> ;< span id =addToBaskettext>加入购物篮< / span>< / a>'）; 
 $（'。betabutton'）。removeClass（invalidBtn）; 
 
  

解决方案

你可能在找什么。

  $（＃textbox）。on（change，function（）{
 $（this）.val（function（index，value）{
 return value.replace（'Avenue'，'Ave.'）; 
}）; 
}）; 
  

http://jsfiddle.net/decx8sw9/

I have a webpage where people enter information (name, job title, address, etc.) and it auto creates a business card for them. I currently have some jQuery that uses .change and looks at a field when a user changes it.

It looks for issues with what they enter, because some things must be in a certain format (ex- They enter the word "Avenue" and it won't let them add the item to their cart until they change it to Ave.)

I am trying to find some way to do this on the fly automatically with JS/jQuery, but I'm not sure what to do. What I would like is for the field to update itself, so if the user puts in "Avenue" it would auto update to "Ave." after the user tabs / exits the field.

Any idea on what JS and/or jQuery can be used to do this?

Here is my current code:

 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");
    }

解决方案

Here is a working sample of what you may be looking for.

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

http://jsfiddle.net/decx8sw9/

这篇关于自动更改表单字段中的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！