大文字問題をkeyUpイベント
-
19-09-2019 - |
質問
私は、keyUpイベントに大文字に変わってしまうの入力を持っていると思います。だから私は、keyUpイベントに単純なイベントを添付する。
HTML
<input id="test"/>
のJavascript(jQueryを使って)
$("#test").keyup(function(){
this.value = this.value.toUpperCase();
});
しかし、私はあなたが左矢印を押すと、ChromeとIEで、自動的にカーソルが最後に移動していることが分かりました。私は、入力が唯一の文字である場合、私は検出する必要があることに気づきます。私は、検出のためにキーコードの範囲または正規表現を使用する必要がありますか?
解決
それとも、(これはおそらく、より速く、よりエレガントである)以下を使用することができます:
<input style="text-transform: uppercase" type='text'></input>
しかし、それはフォームデータでバックとして型付けされた値を送信し、そのデータベース内のすべてのキャップとしてそれを保存するために、次のいずれかを使用します:
のMySQL:UPPER(str)
PHP:strtoupper()
他のヒント
別の解決策、あなたが使用している場合、テキストを-変換:大文字; CSSプロパティます:
<input id='test' style='text-transform: uppercase;' type='text'></input>
とjQueryの助けを借りて、あなたはの blurイベントを選択します:
を$("#test").blur(function(){
this.value = this.value.toUpperCase();
});
このソリューションを使用すると、上側のデータベースフィールドには持っていない入力フィールドにテキストを書き換える/挿入することができます。
、あなたは運動とユーザーのためのカーソルを使用することができますこれを使用します:
<input onkeyup="MakeMeUpper(this)" type="text"/>
そして、あなたのJSコードパートに入れます:
function MakeMeUpper(f, e){
var actualValue = f.value;
var upperValue = f.value.toUpperCase();
if( actValue != upperValue){
f.value = upperValue;
}
}
ユーザーがテキスト(左または右矢印)ではない何かを入力した場合。 このコードは、テキストを変更しません
うん、そうです。あなたがこれを行うことができます:
$("#test").keyup(function(){
var upper = this.value.toUpperCase();
if (this.value != upper)
this.value = upper;
});
それを変更する必要がある場合にのみ値を変更します。しかし、それはまだあなたがabd
を入力すると、左に移動するという問題が残ります、c
を取得するabcd
を打つと、カーソルはまだ終わりに移動してしまいます。
のJavascript(jQueryを使って)
$("#test").keyup(function(){
$(this).val($(this).val().toUpperCase());
});
var str = $(this).val();
if (evt.keyCode != 37 && evt.keyCode != 39)
{
str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
return letter.toUpperCase();
});
$(this).val(str);
}
あなたはおそらく、あなたからkeyup関数内のkeyCodeを見てみたい。
var UP_ARROW = 38,
DOWN_ARROW = 40;
$('#test').keyup(function(evt){
if (evt.keyCode == UP_ARROW)
{
this.value = this.value.toUpperCase();
}
if (evt.keyCode == DOWN_ARROW)
{
this.value = this.value.toLowerCase();
}
});