2011-10-21 10 views
4

最近スタイリングの目的で、<a>タグを送信ボタンとして使用しました。 フォームとその検証を処理するJSプラグインがあります。ユーザーがテキストフィールドでオートコンプリートを使用しているかどうかを検出するにはどうすればよいですか?

通常のフォームをシミュレートするには、ユーザーが送信するテキストフィールドに入力すると、キー入力時にフォームが入力され、送信されます。

問題は、ユーザーがFirefoxからのオートコンプリートドロップダウンにEnterキーを押したときなどに、フォームを検出してまだ送信しようとしている場合です。

アイデア?私は自分のフォームハンドラに、フォームに見つからないイベントに隠れた送信ボタンを追加することがあります....

答えて

0

私は単純に自分のバリデーション・プラグインを自動的に作成して、サブミット・ボタンを探しました。存在しない場合は、それを追加し、-9999pxの左上のスタイルにします。このようにして、ユーザーが送信をヒットした場合、ネイティブアクションが実行されます。私はただdisplay:noneをボタンで使うことはできません。あるいは、いくつかのブラウザは起動しません。

0

オートコンプリートの動作を無効にしてオフにすることができます。

<form autocomplete="off"> 

</form> 
1

上下の矢印を見ることができ、一度押すとinAutoCompleteフラグが設定されます。このような何か:ユーザーがポップアップオートコンプリートウィンドウなしで下向き矢印を押すと

$(document).ready(function() { 
    var autoCompleteActive = false; 

    $(document).keydown(function(e) { 
     switch (e.keyCode) { 
      case 38: 
      case 40: autoCompleteActive = true; 
      break; 
      default: autoCompleteActive = false; 
      break; 
     } 

     if(e.keyCode==13 && !autoCompleteActive) { 
      //do your onEnter stuff 
     } 
    }); 
}); 

しかし、彼らはそれが送信される前に2回入力押す必要があります。

オートコンプリートをスクリプト化するか、jQuery autocomplete pluginを使用してオートコンプリートウィンドウをより詳細に制御することをおすすめします。

+0

私は職場で横走していますが、私はこの解決策を試しています。私はenterキーリスナーを取り除いて、そのトリックを行う隠しサブミットボタンを配置することに賛成するかもしれませんが、私は少ない労力で考えると思います。 –

0

これはうまくいかないでしょうか?

var hasFocus = false; 
    $('#yourAutoCompleteElement').focusin(function() { 
     hasFocus = true; 
    }); 

    $('#yourAutoCompleteElement').focusout(function() { 
     hasFocus = false; 
    }); 

    $('#yourAtagSubmit').keyUp(function (event) { 
     if (event.keyCode == ENTER && !hasFocus) { 
      // submit 
     } 

     return; 
    }); 

編集:タグ送信ボタンを使用することは実際には悪いことです。同じ方法で通常の送信ボタンをスタイルすることができるはずです。すべてのデバイスで機能します。

関連する問題