keyup大寫問題

我想要在keyup上有一個輸入變成大寫。所以我附上了一個簡單的關鍵事件。keyup大寫問題

HTML

<input id="test"/>

的JavaScript（用jQuery）

$("#test").keyup(function(){ 
    this.value = this.value.toUpperCase(); 
});

但我發現，在Chrome和IE瀏覽器，當你按下左箭頭，光標自動移動到結束。我注意到我應該檢測輸入是否只有字母。我應該使用keycode範圍還是regexp進行檢測？

例子：http://jsbin.com/omope3

來源

2010-01-09 jackysee

或者你可以用下面的（這可能是更快，更優雅）：

<input style="text-transform: uppercase" type='text'></input>

但是發送的類型的值回表單數據，所以使用下列任一來存儲它作爲全大寫的數據庫：

MySQL的：UPPER(str)

PHP：strtoupper()

來源

2010-01-09 08:05:50 Chetan

該方法的一個附加優點是用戶只能看到全部大寫的文本被輸入，並且不必像使用Javascript方法一樣將他/她的輸入文本轉換爲大寫。 – Chetan 2010-01-09 08:07:23

+1，在將數據發送到服務器之前，也可以在表單的onsubmit事件中將真值轉換爲大寫。 – 2010-01-09 11:42:39

+1，比我的回答好。我不知道這個文本轉換選項，它是完全跨瀏覽器嗎？ – 2010-01-09 17:17:53

-2

你可能想看看的密鑰代碼你KEYUP功能。

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

來源

2010-01-09 06:13:39

是的，看起來像某些瀏覽器在值更新時將光標移動到最後。你可以這樣做：

$("#test").keyup(function(){ 
    var upper = this.value.toUpperCase(); 
    if (this.value != upper) 
     this.value = upper; 
});

它只會改變它的值，如果它需要改變。但是，仍然會出現如下問題：如果輸入abd，向左移動，則輸入c即可得到abcd，遊標仍然會移動到最後。

來源

2010-01-09 06:40:53

另一種解決辦法，如果你的U se text-transform：大寫; CSS屬性：

<input id='test' style='text-transform: uppercase;' type='text'></input>

而且與jQuery幫助您選擇模糊事件：

$("#test").blur(function(){ this.value = this.value.toUpperCase(); });

有了這個解決方案，您不必上的數據庫字段，可以使用光標進行移動，用戶可以在輸入欄中插入/重寫文本。

來源

2010-10-13 15:05:01

的JavaScript（用jQuery）

$("#test").keyup(function(){ 
    $(this).val($(this).val().toUpperCase()); 
});

來源

2012-01-12 08:15:01 lahphim

這很好，但你可能需要this.val（）而不是this.value（）。 – Knossos 2012-01-12 08:27:15

謝謝@Knossos。 – lahphim 2012-01-13 04:57:39

使用此：

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

該代碼將不會更改文本，如果用戶輸入了不是文本的東西（向左或向右箭頭）。

乾杯！

來源

2012-01-23 20:41:35

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

來源

2015-03-03 07:28:21

回答

相關問題