jQuery のイベント発生が１つずつ増えて行ってしまいます

フォームで入力した後 enter キーを押したら次のフォームにfocusする機能を作っています。ここではテストとして「表示したよ！」と alertさせています。
この状態で focus した後 enterキーを押したら、1度目は「表示したよ！」とalertされるだけなのですが、２回目からは「表示したよ！」が二回表示され、3度目は三回表示されます。どうしてこんなことになったのでしょうか、教えてください。

html
1<div class="col-sm-6 col-sm-offset-3">  
2  <h2 class="sample">Sign up</h2>
3  
4  <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
5    <%= devise_error_messages! %>
6  
7    <div class="field">
8      <%= f.label :name %>
9      <span id="user_name_count"></span>
10      <span id="user_name_error"></span><br/>
11      <%= f.text_field :name, class: "form-control" %>
12    </div>
13
14    <div class="field">
15      <%= f.label :email %>
16      <span id="user_email_error"></span><br />
17      <%= f.email_field :email, autofocus: true, class: "form-control", placeholder: "メールアドレスを入力" %>
18    </div>
19
20    <br/>
21    <span id="user_password_error"> </span>
22  
23    <div class="field">
24      <%= f.label :password %>
25      <% if @minimum_password_length %>
26      <em>(<%= @minimum_password_length %> characters minimum)</em>
27      <% end %><br />
28      <%= f.password_field :password, autocomplete: "off", class: "form-control" %>
29    </div>
30
31    <div class="field">
32      <%= f.label :password_confirmation %><br />
33      <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %>
34    </div>
35
36    <div class="actions">
37      <%= f.submit "Sign up", class: "btn" %>
38    </div>
39  <% end %>
40</div>

javascript
1$(function(){
2  $("input").focus(function(){
3    var target_num = target_form.index(this);
4    var target_nums = (target_form.length - 1);
5
6    target_form.on("keypress", function(e){
7      if(e.which == 13){
8        alert("表示したよ!");
9        return e.which !== 13;
10      }
11    });
12  });
13});

行動規範の内容に同意します

回答2件

ベストアンサー

focusイベントの中に.on('keypress')を入れてしまっているので、focusが動くたびにイベントが追加されていきます。

今回の場合、inputをfocusしなければその中でkeypressイベントも発生しないので、イベントバブリングを使えばもっとシンプルに書ける気もします。

javascript
1$(function(){
2  target_form.on("keypress", 'input', function(e){
3    if(e.which == 13){
4      alert("表示したよ!");
5      return false;
6    }
7  });
8});