2

input type="text"の一部のイベントを適切に処理できません。[^0-9]文字のみを受け入れるフィルターが必要です。

次のヘルプが必要です。

  • Control+Pasteコマンドからのコンテンツを受け入れないでください。Control + V（キーボード）またはマウスの右クリック+オプションの貼り付けのいずれかから。

私がこれまでに試したこと：

  • keypressイベント私はキーボードからの入力をうまく処理します。（[^ 0-9]になく、enter、backspace、home、endなどの文字は単に無視されます）。

  • keyup私は奇妙なことにControl+Paste（キーボード）イベントを処理します。文字列を貼り付け、文字列を貼り付けた後、ホワイトリスト以外の文字を切り抜きます。PS： しかし、これは右クリック+貼り付け（マウス）では機能しません。

  • onChangeガベージ文字列は、ユーザーがフィールドをぼかすまで表示されたままになります。

私が欲しいもの：

  • サンプル文字列「123.321.456-78」をコピーして「12332145678」または「abc！2¨＃7」を貼り付け、「27」を貼り付けます。

  • ホワイトリスト以外の文字を可能な限り受け入れないでください。（$（'＃field'）。val（ "trash input 123"）でも。

上記のすべての問題から、入力をうまくまたは奇妙に（別名：keuup）処理できますが、右クリック+貼り付け（マウス）はイベントをトリガーしないため、適切な処理を行うことができます。

インターバルチェックをしようと思ったのですが、醜いです。

編集：

以下のコード

function soNumeroInteiro_keypressHandler(event)
{
    var code = event.keyCode || event.which;

    switch(code)
    {
        case  8: // backspace
        case 37: // left
        case 39: // right
        case  9: // tab
        case 46: // delete
        case 35: // end
        case 36: // home
            return true;
        break; 

        case  86: // control + A
        case  97: // control + V
        case 120: // control + X
            if (event.ctrlKey) {
                return true;                
            }
        break;
    }

    var tecla = String.fromCharCode(code);

    return tecla.match(/^\d$/) != null;
}

function soNumeroInteiro_keyupHandler(event)
{
    event.currentTarget.value = event.currentTarget.value.replace(/[^0-9]/g, '');
}
4

1 に答える 1

1

マウスクリックイベントについては、次の質問を参照してください： jQueryでマウスの左クリックと右クリックを区別する方法

これで、マウスクリックイベントが発生しました。右クリックでも、コンテンツを短時間（2秒？）ポーリングして、変更を検出し、コンテンツの検証を処理できます。このようにして、ビジネスロジックのニーズに基づいて、有効なコンテンツを受け入れるか拒否するかを選択できます。

編集：メモを追加するだけで、コンテンツが貼り付けられる前に（少なくとも一部のテストケースでは）発生するという点で、onpasteイベントは正しく機能しません。

例：

$('#pasteyMe').on('paste', function() {
    $(this).val();// gets the content prior to the paste event
});

これを回避するには、changeなどの別のイベントウォッチャーを設定してから、次のように起動します。

$('#pasteyMe').on('click focus blur paste', function() {
    var me = this;
    window.setTimeout(function() {
       $(me).trigger('change');
    }, 1);
});

$('#pasteyMe').change(function() {
    $('#resulty').text($(this).val());
});

ここで実際にこれを参照してください：http：//jsfiddle.net/MarkSchultheiss/kQxAj/

于 2012-06-21T13:03:09.410 に答える