Masked编辑单个输入文本框的两种代码格式

我有两个面具G999-9和H99-9代表毕业生和荣誉，这两个面具都需要为单个输入文本html控件输入。Masked编辑单个输入文本框的两种代码格式

第一次打字时，如果打到G，我希望它显示毕业格式的格式，对于荣誉，我希望它在输入时显示荣誉格式的格式。有没有简单的方法来在JavaScript或jQuery中做到这一点？

例子：

 
G111-1 
H91-5 
G001-3 
G___-_ (If you hit G it should show the Graduate format) 
H__-_ (If you hit H it should show the Honors format.) 
____-_ (Type anything else, or nothing do this.)

感谢，马克

来源

2011-07-07 RetroCoder

Regex Based Demo

耶！正则表达式！是的，像所有其他（非HTML）解析问题一样，这是一个正则表达式。 :)

$("input").keyup(function(e){ 
    if(e.keyCode > 40 || e.keyCode < 37) 
    { 
     var validInput = $(this).val().match(/(([G])(([0-9]{3}[-]([0-9]{0,1})?|[0-9]{0,3})?)?|([H])(([0-9]{2}[-]([0-9]{0,1})?|[0-9]{0,2})?)?)/); 
     $(this).val(validInput?validInput[0]:"") 
    } 
});

这有点复杂（帮助优化它将不胜感激），但它的工作原理。

来源

2011-08-20 03:05:30

+1不仅需要时间来建立rege x，但为了帮助说明我的观点，即正则表达式会是令人讨厌的。：） –

@John Green约定的XD，但它很有趣！这几乎就像一个数学谜题XD –

我真的希望这适用于显示错误后的格式。如果留下格式并且人们在键入时键入实际格式的类型，那将很酷。通常，当某人开始输入时，格式会被删除。 – RetroCoder

简单的方式？你要么必须走字符串，要么使用一些奇特的正则表达式。

通常情况下，我们会使用正则表达式来解决这个问题，但是假设您对正则表达式不太了解（也许是一个糟糕的假设，但大多数人可以先阅读它们），并且在让你下面发生了什么希望，我写的程序上多：

<input type="text" class="formatted" /> 

$(document).ready(function(){ 
    function applyMask(instr){ 
     var pOut = [], delimitter = '-', format = 0, pSplit = 4, pMax = 6; 
     // There are a lot of ways to express this. I just chose one that should 
     // be understandable. 
     if ((instr.length > 0) && (instr[0].toUpperCase() == 'H')) 
     { 
      pSplit = 3; 
      pMax = 5; 
     } 
     pMax = Math.min(pMax, instr.length); 

     for (var i=0; i < pMax; i++) 
     { 
      if ((i==pSplit) && (instr[i] != delimitter)) 
      { 
       pOut.push(delimitter); 
      } 
      else 
      { 
       pOut.push(instr[i]); 
      } 
     } 
     return pOut.join(''); 
    } 

    $('.formatted').keyup(function(){ 
     $(this).val(applyMask($(this).val()).toUpperCase()); 
    }); 
});

这里有一个小提琴，甚至：http://jsfiddle.net/UdcND/

来源

2011-08-20 01:36:17

有一些jQuery插件用于文本输入轻松转换为遮罩编辑：

一个简单而有用的插件：http://www.pengoworks.com/workshop/js/mask/
另一个很好的选择：http://digitalbush.com/projects/masked-input-plugin/

来源

2012-11-26 07:25:01

Masked编辑单个输入文本框的两种代码格式

回答

相关问题