Question

我想强制文本字段的输入值符合特定格式。它需要大写，不允许数字。

我希望在onKeydown()上启动此活动。

示例：

Lionel MESSI => Lionel Messi
LiONEL MesSI => Lionel Messi

Neymar JR => Neymar Jr
Neymar 22 JR => Neymar Jr

Franck D'HONNEUR => Franck D'Honneur

Kevin PEREZ ROBERTO => Kevin Perez Roberto

Answer 1

没有简单的单行方式。但是，您可以创建一个可以为您格式化名称的功能。

最初取自this answer，我稍微修改了它以反映您想要的输出：

＆＃13;

var name1 = "Lionel MESSI";
var name2 = "LiONEL MesSI";
var name3 = "Neymar JR";
var name4 = "Neymar 22 JR";
var name5 = "Franck D'HONNEUR";
var name6 = "Kevin PEREZ ROBERTO";

function toTitleCase(str) {
  return str.replace(/\w\S*/g, function(txt){
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  }).replace(/[0-9]/g, '');
}

console.log(toTitleCase(name1));
console.log(toTitleCase(name2));
console.log(toTitleCase(name3));
console.log(toTitleCase(name4));
console.log(toTitleCase(name5));
console.log(toTitleCase(name6));

＆＃13;

您可能需要从MDN文档中查看toUpperCase()和toLowerCase()。

要在onKeyDown()上获得此功能，您可以像下面的代码段一样使用jQuery。我建议反对onKeyDown()，因为这会产生一种奇怪的用户体验。请改为onBlur。

＆＃13;

function toTitleCase(str) {
  return str.replace(/\w\S*/g, function(txt){
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  }).replace(/[0-9]/g, '');
}

$("#name").on("keydown", function() {
  $(this).val(toTitleCase($(this).val()));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Name: <input id="name">

＆＃13;

Answer 2

借助这个问题的小助手功能：How do I make the first letter of a string uppercase in JavaScript?

我写了一个快速脚本，触发输入模糊：

$(document).ready(function() {
    function capitalizeFirstLetterOfEachWord(string) {
        strArr = string.split(' ');
        resArr = [];
        for(i=0;i<strArr.length;i++){
            resArr[i] = strArr[i].charAt(0).toUpperCase() + strArr[i].slice(1);
        }
        return resArr.join(" ");
    }

    $('.forceCapital').blur(function(e) {
        $(this).val(capitalizeFirstLetterOfEachWord($(this).val()));
    });
});

https://jsfiddle.net/sa2ox30d/2/

如何格式化keyDown（）的输入值？

2 个答案: