javascript - ASP.NET テキストボックスで入力を強制的に大文字にするにはどうすればよいですか?

Question

ASP.NET アプリケーションを作成しています。Web フォームにテキストボックスがあり、ユーザーが入力するものを強制的に大文字にしたいと考えています。フロントエンドでやりたい。また、このテキストボックスには検証コントロールがあることにも注意してください。そのため、ソリューションが ASP.NET の検証に干渉しないようにする必要があります。

明確化: CSS テキスト変換により、ユーザー入力が大文字で表示されるようです。ただし、検証コントロールが失敗するため、内部ではまだ小文字です。ご覧のとおり、検証コントロールは有効な州コードが入力されているかどうかを確認しますが、使用している正規表現は大文字でしか機能しません。

score 58 · Accepted Answer

CSSとバックエンドを組み合わせて使ってみませんか？使用する：

style='text-transform:uppercase'

TextBoxで、および使用後のコードで：

Textbox.Value.ToUpper();

バリデーターの正規表現を簡単に変更して、小文字と大文字を使用することもできます。これは、大文字を強制するよりもおそらく簡単な解決策です。

score 23 · Accepted Answer

テキストボックスに CSS スタイルを使用します。CSS は次のようになります。

.uppercase
{
    text-transform: uppercase;
}

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

score 9 · Accepted Answer

さて、テストの後、これはより良い、よりクリーンなソリューションです。

$('#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);

});

score 8 · Accepted Answer

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

score 6 · Accepted Answer

キー押下イベントをインターセプトし、小文字のものをキャンセルし、それらの大文字バージョンを入力に追加できます。

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 の両方で機能します。ここで実際の動作を見ることができます。

score 3 · Accepted Answer

テキスト変換 CSS property specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase

Css クラス

WebControl.CssClass プロパティ

詳細については、https://developer.mozilla.org/en/docs/Web/CSS/text-transformをご覧ください。

https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.webcontrol.cssclass(v=vs.110).aspx

Style="text-transform: uppercase;"または_CssClass="upper"

score 3 · Accepted Answer

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

score 2 · Accepted Answer

これは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ライブラリが必要です。

score 2 · Accepted Answer

今日も似たようなことをしました。変更されたバージョンは次のとおりです。

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

基本的に、スクリプトは、テキストボックスがフォーカスを失ったときに発生するイベントを添付します。

score 2 · Accepted Answer

この問題について、一般的な 4 つのブラウザーバージョンで分析を行いました。

style タグ simple は文字を大文字で表示しますが、コントロール値は小文字のままです
上に表示された char コードを使用したキープレス機能は、Firefox の chrome と safari でコントロールへのCtrl+機能を無効にするので、少し心配です。V
文字レベルを大文字にする場合のもう 1 つの問題は、文字列全体が大文字に変換されないことです。

私が見つけた答えは、スタイルタグと組み合わせてキーアップでこれを実装することです.

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

score 2 · Accepted Answer

2

 style='text-transform:uppercase'

于 2008-10-14T19:00:19.757 に答える

score 1 · Accepted Answer

フロントエンドにtext-transformCSSを使用してから、検証する前に文字列サーバー側でtoUpperメソッドを使用します。

score 1 · Accepted Answer

これが私のために働いた解決策です。

http://plugins.jquery.com/project/bestupper

JavaScriptをhttp://plugins.jquery.com/files/jquery.bestupper.min.js.txtから取得する必要があります。

チャームのように機能します！

score 1 · Accepted Answer

1

テキストボックスのスタイルをtext-transform: uppercase ?として設定します。

于 2008-10-14T18:57:19.997 に答える

score 1 · Accepted Answer

ここでCSSが役に立ちます。

style="text-transform: uppercase";"

これは役に立ちますか？

score 0 · Accepted Answer

少し遅れていることに気づきましたが、ASP.NET AJAX で動作する適切な答えが見つからなかったため、上記のコードを修正しました。

function ToUpper() {
        // So that things work both on FF and IE
        var evt = arguments[0] || event;
        var char = String.fromCharCode(evt.which || evt.keyCode);

        // Is it a lowercase character?
        if (/[a-z]/.test(char)) {
            // convert to uppercase version
            if (evt.which) {
                evt.which = char.toUpperCase().charCodeAt(0);
            }
            else {
                evt.keyCode = char.toUpperCase().charCodeAt(0);
            }
        }

        return true;
    }

次のように使用します。

       <asp:TextBox ID="txtAddManager" onKeyPress="ToUpper()" runat="server" 
             Width="84px" Font-Names="Courier New"></asp:TextBox>

score 0 · Accepted Answer

  <telerik:RadTextBox ID="txtCityName" runat="server" MaxLength="50" Width="200px"
                            Style="text-transform: uppercase;">

score 0 · Accepted Answer

JavaScript には文字列の「toUpperCase()」関数があります。

だから、これらの行に沿って何か：

function makeUpperCase(this)
{
    this.value = this.value.toUpperCase();
}

javascript - ASP.NET テキストボックスで入力を強制的に大文字にするにはどうすればよいですか?

21 に答える 21

Related

Reference