如何在 ASP.NET 文本框中強制輸入大寫？

問題描述

我正在編寫一個 ASP.NET 應用程序。我在 webform 上有一個文本框，我想強制任何用户類型大寫。我想在前端這樣做。您還應該注意，這個文本框上有一個驗證控件，所以我想確保解決方案不會干擾 ASP.NET 驗證。

澄清：看起來 CSS 文本轉換使用户輸入顯示為大寫。然而，在引擎蓋下，當驗證控制失敗時仍然是小寫。您會看到，我的驗證控制檢查是否輸入了有效的狀態代碼，但是我正在使用的正則表達式僅適用於大寫字符。

最佳解決方案

為什麼不使用 CSS 和後端的組合？使用：

style='text-transform:uppercase'

在 TextBox 上，並在你的代碼中使用：

Textbox.Value.ToUpper();

您還可以輕鬆地將驗證器上的正則表達式更改為使用小寫和大寫字母。這可能比強制大寫更容易解決。

次佳解決方案

在文本框中使用 CSS 樣式。你的 CSS 應該是這樣的：

.uppercase
{
    text-transform: uppercase;
}

<asp:TextBox ID="TextBox1" runat="server" Text="" CssClass="uppercase"></asp:TextBox>;

第三種解決方案

好的，經過測試，這裏是一個更好，更乾淨的解決方案。

$('#FirstName').bind('keyup', function () {

    // Get the current value of the contents within the text box
    var val = $('#FirstName').val().toUpperCase();

    // Reset the current value to the Upper Case Value
    $('#FirstName').val(val);

});

第四種方案

您可以攔截按鍵事件，取消小寫字母，並將其大寫版本附加到輸入：

window.onload = function () {
    var input = document.getElementById("test");

    input.onkeypress = function () {
        // So that things work both on Firefox and Internet Explorer.
        var evt = arguments[0] || event;
        var char = String.fromCharCode(evt.which || evt.keyCode);

        // Is it a lowercase character?
        if (/[a-z]/.test(char)) {
            // Append its uppercase version
            input.value += char.toUpperCase();

            // Cancel the original event
            evt.cancelBubble = true;
            return false;
        }
    }
};

這可以在 Firefox 和 Internet Explorer 中使用。你可以看到它在行動 here 。

第五種方案

**I would do like:
<asp:TextBox ID="txtName" onkeyup="this.value=this.value.toUpperCase()" runat="server"></asp:TextBox>**

第六種方案

<!-- Script by hscripts.com -->
<script language=javascript>
    function upper(ustr)
    {
        var str=ustr.value;
        ustr.value=str.toUpperCase();
    }

    function lower(ustr)
    {
        var str=ustr.value;
        ustr.value=str.toLowerCase();
    }
</script>

<form>
    Type Lower-case Letters<textarea name="address" onkeyup="upper(this)"></textarea>
</form>

<form>
    Type Upper-case Letters<textarea name="address" onkeyup="lower(this)"></textarea>
</form>

第七種方案

我今天剛剛做了類似的事情。這是修改版本：

<asp:TextBox ID="txtInput" runat="server"></asp:TextBox>
<script type="text/javascript">
    function setFormat() {
        var inp = document.getElementById('ctl00_MainContent_txtInput');
        var x = inp.value;
        inp.value = x.toUpperCase();
    }

    var inp = document.getElementById('ctl00_MainContent_txtInput');
    inp.onblur = function(evt) {
        setFormat();
    };
</script>

基本上，腳本附加在文本框失去焦點時觸發的事件。

第八種方案

我會這樣做使用 jQuery 。

<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#txt").keydown(function(e) {
            if (e.keyCode >= 65 & e.keyCode <= 90) {
                val1 = $("#txt").val();
                $("#txt").val(val1 + String.fromCharCode(e.keyCode));
                return false;
            }
        });
    });
</script>

您必須在/script 文件夾中具有 jQuery 庫。

第九種方案

我對四個流行瀏覽器版本的這個問題做了一些分析。

style 標籤簡單顯示大寫字母，但控件值仍然保持為小寫
使用上面顯示的 char 代碼的按鍵功能有點擔心，因為在 firefox chrome 和 safari 它禁用功能 Ctrl + V 進入控件。
使用字符級別到大寫字母的另一個問題也不是將整個字符串轉換為大寫字母。

我發現的答案是在鍵盤上結合樣式標籤來實現。

<-- form name="frmTest" -->
<-- input type="text" size=100 class="ucasetext" name="textBoxUCase" id="textBoxUCase" -->
<-- /form -->

window.onload = function() {
    var input = document.frmTest.textBoxUCase;
    input.onkeyup = function() {
        input.value = input.value.toUpperCase();
    }
};

參考文獻

How can I force input to uppercase in an ASP.NET textbox?

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

如何在 ASP.NET 文本框中強制輸入大寫？