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

发布于 2024-11-19 02:32:21 字数 392 浏览 8 评论 0原文

我有两个掩码 G999-9 和 H99-9，分别代表毕业生和荣誉，都需要输入单个输入文本 html 控件。

第一次打字时，如果它击中了 GI，我希望它显示研究生格式的格式，对于荣誉学位，我希望它在打字时显示荣誉学位的格式。有没有一种简单的方法可以在 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.)

谢谢，马克

原文

I have two masks G999-9 and H99-9 which stand for graduates and honor which both need to be entered for a single input text html control.

While first typing, if it hits a G I would like it to show the format for the Graduate format, and for the Honors, I would like it to show the format for the Honors format while typing it out. Is there a simple way to do this in javascript or jQuery?

Examples:

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.)

Thanks,
Marc

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

孤云独去闲 2024-11-26 02:32:21

基于正则表达式的演示

耶！正则表达式！是的，就像所有其他（非 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]:"")
    }
});

这有点复杂（如果能帮助优化它，我们将不胜感激），但它确实有效。

Regex Based Demo

Yay! regex! Yes, like every other (non-HTML) parsing questions there's a regex for that. :)

$("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]:"")
    }
});

It's a bit convoluted (help in optimizing it would be much appreciated), but it works.

回复收藏 0 原文

煮酒 2024-11-26 02:32:21

简单的方法吗？您要么必须遍历字符串，要么使用一些奇特的正则表达式。

通常，我们会为此使用正则表达式，但假设您对正则表达式不太了解（也许是一个糟糕的假设，但大多数能够阅读它们的人会首先倾向于它们）并希望让您留住根据发生的事情，我更程序化地编写了它：

<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/

Simple way? You're either going to have to walk the string or use some fancy regex.

Normally, we'd use regexes for this, but with the assumption that you don't know so much about regexes (perhaps a bad assumption, but most people that can read them will gravitate towards them first) and in the hopes of keeping you following what is happening, I wrote it more procedurally:

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

Here's a fiddle, even: http://jsfiddle.net/UdcND/

回复收藏 0 原文