20

ユーザーがフォームに入力しているときに、入力時に Enter キーを押すイベントをキャプチャしたいと考えていますtype="text"。これはウェブ全体で行われていますが、答えはわかりません。

これは私がこれまでに持っているものです:

HTMLファイルには、次のようなテキスト入力があります。

<input type="text" size=50 class="newlink">

Javascript ファイルでは、Enter キーを押してフォームを効果的に送信するユーザーをキャプチャしようとしています。次に、入力からテキストを取得し、データベースに格納します。

  Template.newLink.events = {
    'submit input.newLink': function () {
      var url = template.find(".newLink").value;
      // add to database
    }
  };
4

4 に答える 4

43

イベントは、submit単一の入力要素ではなく、フォームから発行されます。

流星の組み込みイベントマップはここに文書化されています：http：//docs.meteor.com/#eventmaps。

キーボードイベントをリッスンする必要があります（keydown, keypress, keyup）。イベントハンドラー内で、それがリターン/エンターキー（Keycode 13）であるかどうかを確認し、成功した場合に続行します。

Template.newLink.events = {
  'keypress input.newLink': function (evt, template) {
    if (evt.which === 13) {
      var url = template.find(".newLink").value;
      // add to database
    }
  }
};
于 2012-10-22T12:05:51.840 に答える
6

todosの例 ( client/todos.js )で、これがどのように達成されるかを調べることができます。

入力フィールドに一般的なイベント ハンドラーを使用します (以下を参照)。残りのコードを参照して使用することができます。

////////// Helpers for in-place editing //////////

// Returns an event map that handles the "escape" and "return" keys and
// "blur" events on a text input (given by selector) and interprets them
// as "ok" or "cancel".

var okCancelEvents = function (selector, callbacks) {
  var ok = callbacks.ok || function () {};
  var cancel = callbacks.cancel || function () {};

  var events = {};
  events['keyup '+selector+', keydown '+selector+', focusout '+selector] =
    function (evt) {
      if (evt.type === "keydown" && evt.which === 27) {
        // escape = cancel
        cancel.call(this, evt);

      } else if (evt.type === "keyup" && evt.which === 13 ||
                 evt.type === "focusout") {
        // blur/return/enter = ok/submit if non-empty
        var value = String(evt.target.value || "");
        if (value)
          ok.call(this, value, evt);
        else
          cancel.call(this, evt);
      }
    };

  return events;
};
于 2013-07-10T12:23:26.117 に答える
1

このjs関数を一度使用して、テキストフィールドでリターンキーを使用してフォームデータを送信するユーザーを抑制しました。おそらく、キャプチャに合わせて変更できますか？

function stopRKey(evt) { // Stop return key functioning in text field.
    var evt  = (evt) ? evt : ((event) ? event : null);
    var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
    if ((evt.keyCode == 13) && (node.type=="text")) { return false; } 
}
document.onkeypress = stopRKey;
于 2012-10-22T12:14:23.927 に答える