8

2つの特定の入力フィールド以外がjqueryの使用に焦点を合わせている場合、バックスペースキーストロークを無効にするにはどうすればよいですか?

これが私の現在のコードです(現在2つのテキストボックスを含みます):

$(document).keypress(function(e){
  var elid = $(document.activeElement).attr('id');
  if(e.keyCode === 8 && elid != 'textbox1' || elid != 'textbox2'){
      return false;
  };
});

しかし、これは機能していません....何かアイデアはありますか?

4

9 に答える 9

12

私はこれがトリックを行うと思います:

$(document).keydown(function(e) {
    var elid = $(document.activeElement).hasClass('textInput');
    if (e.keyCode === 8 && !elid) {
        return false;
    };
});

テキストボックスのクラスが「textInput」であると想定します。

これが実際の例です

于 2010-04-15T14:11:29.427 に答える
8

これにより、入力ボックスに特定のクラスを追加しなくても、サイトのバックスペースが無効になります。入力ボックスを使用する場合を除いてバックスペースを無効にするには、.is( "input:focus")を使用します。テキストエリアボックスを使用する場合を除いてバックスペースを無効にする場合は、.is( "input:focus、textarea:focus")を使用します。

$(document).keypress(function(e){ 
    var elid = $(document.activeElement).is("input:focus"); 
    if(e.keyCode === 8 && !elid){ 
       return false; 
    }; 
});
于 2011-11-22T12:29:24.833 に答える
6

Hudson-Peralta + QF_Developerのソリューションは素晴らしいですが、1つの欠点があり
ます。ラジオボタンまたはチェックボックスにフォーカスがある場合でも、バックスペースボタンを押すとページから戻されます。このギャップを回避するための変更は次のとおりです。

$(document).keydown(function(e){ 
  var elid = $(document.activeElement).is('input[type="text"]:focus, textarea:focus'); 
    if(e.keyCode === 8 && !elid){ 
      return false; 
    }; 
});

編集20130204:
keypress()に置き換えられましたkeydown()
上記のコードは正しく機能するようになりました。

編集20151208:@outofmind
のコメントで述べたように、バックスペースが押されたときにあなたを元に戻す可能性のある入力タイプがもっとあります。is()メソッドのコンマ区切りのセレクターリストに、文字を直接入力でき、HTMLコードで実際に使用される任意のタイプの入力フィールド(、、、など)を追加しinput[type="password"]:focusinput[type="number"]:focusくださいinput[type="email"]:focus

于 2012-11-13T10:36:05.260 に答える
5

textareasを処理するには、少し変更が必要だと思います。

var elid = $(document.activeElement).is("input:focus, textarea:focus"); 
于 2012-05-23T09:47:48.640 に答える
4

受け入れられた回答にわずかな変更を加えました。これは誰かに役立つ可能性があります。

$(document).keydown(function(e) {
    var elid = $(document.activeElement).is("input, textarea") ;
    if (e.keyCode === 8 && !elid) {
        if(e.ctrlKey) {
            window.history.back()
        }
        else {
            alert("Navigating with Backspace has been disabled. Use CTRL + Backspace if you want to go back to the previous page (and lose any unsaved changes).");
            return false;
        }
    }
});

この方法では、ユーザーはCTRLキーを押しながらBackspaceを使用してナビゲートできますが、を考慮に入れることtextareaもできinputます。

もちろん、代わりにこのようなものを使用することもできます。これにより、ユーザーが何かを入力した場合にページを離れることができなくなります。

于 2013-06-24T14:58:33.153 に答える
2

@Nick Craver、いくつかの理由で恥ずべき答え。質問に答えるか、少なくとも思慮深くひいきにします。

これは、バックスペースがフォームからフォームを奪うとユーザーが不満を言ったためにフォームに使用することになったプロトタイプベースのソリューションです(これは明らかに直感に反することであり、すべてのブラウザーがバックスペースキーを戻るボタンとして使用するのはなぜか疑問に思います)。




        // event handlers must be attached after the DOM is completely loaded
        Event.observe(window, 'load', function() {
          // keypress won't fire for backspace so we observe 'keydown'
          Event.observe(window, 'keydown', function(event){
            // 8 == backspace
            if( event.keyCode == 8) {
                // with no field focused, the target will be HTMLBodyElement
               if( event.target == document.body) {
                  // stop this event from propagating further which prevents                      
                  // the browser from doing the 'back' action
                  event.stop();
               }
             }
          });
        });

于 2011-11-04T16:46:26.060 に答える
2

Hudson-Peraltaの答えは私にとってはうまくいきましたが、多くのキーダウンイベントを使用しているため、小さな変更を加えました。

$(document).keydown(function(e){ 
            var elid = $(document.activeElement).is("input:focus"); 
            if(e.keyCode === 8 && !elid){ 
               e.preventDefault(); 
            }; 
        });
于 2012-02-17T21:38:25.527 に答える
0

私も同じように一生懸命取り組んできました。最後に、答えを見つけました。みんなの便宜のために、http://blog.totusinfo.com/jquery-disable-backspace-for-document-history-except-inputs-and-textarea/にソリューションを配置しました。

于 2012-10-17T08:24:59.420 に答える
0

答えをもう少し変更して、みんなの良い答えを組み合わせました
1.セレクター「input [type = text]:focus、textarea:focus」を使用して、これらの要素のデフォルトの動作を維持し、JPsyが言ったように、入力のデフォルトの動作を防ぎますチェックボックス
2のように、代わりにe.targetを使用して、コードをJQueryのみに依存させるようにしました。これは、すべてのブラウザーがdocument.activeElementを適切にサポートしているかどうかがわからないためです。

編集
3. 「input[type= password]:focus」を追加して、パスワードフィールドも含めます。

     $(document).keydown(function(e){

          var code = e.keyCode;
          var is_to_stop =(!$(e.target).is( "input [type = text]:focus、input [type = password]:focus、textarea:focus"))&&(code == 8);
          if(is_to_stop){
            falseを返します。
          }

    });

于 2013-01-29T08:13:08.793 に答える