javascript - スモールキャップをすべて大文字のテキストに置き換える

Question

テキストボックスですべての小文字を大文字に変換するのに問題があります。

<body>
    <input type="text" id="input_1" class="allcaps"/>
    <input type="text" id="input_2" class="allcaps"/>
</body>

$(document).ready(function () {

    //trigger ng event

    $('.alcaps').live("keyup", function () {
       var fin =   $('.alcaps').val();
       $('.alcaps').val(fin.toUpperCase());
    });                     
});

最初の入力ボックスは内容を大文字に変換しますが、最初のボックスに入力したテキストは 2 番目の入力ボックスにもコピーされます...

score 5 · Accepted Answer

クラスをセレクターとして使用する場合、そのクラスのすべての入力ボックスを選択し、値を最初のものと同じに設定します。thisキーワードを使用して、現在のテキストボックスのみをターゲットにします。

$(document).ready(function() {
    $(document).on('keyup', '.alcaps', function() {
        var fin = this.value;
        this.value = fin.toUpperCase();
    });
});

フィドル

score 2 · Accepted Answer

現在の入力を参照する which を使用できます。また、非推奨であることthisにも注意してください。代わりに次を使用できます。liveon

$(document).on("keyup", ".alcaps", function () {
     this.value = this.value.toUpperCase()
});

score 0 · Accepted Answer

thisハンドラー内のユーザー:

$('.alcaps').live("keyup", function () {
     var fin =   $(this).val();
     $(this).val(fin.toUpperCase());
});

javascript - スモールキャップをすべて大文字のテキストに置き換える

3 に答える 3

Related

Reference