为什么使用jQuery的keydown会重复以前的所有调用？

Question

触发openDetails（）时会显示带有文本输入的div元素。

在“输入”或“保存”时，将检索selectedRows并用于更新batchEdit中的网格。

然而，在随后的“输入”或“保存”调用中，再次进行每个先前调用（具有其先前的选定行），其使用当前数据更新那些行。

  <div class='item-details-form' id="itemDetailsTemplate">
      <div class='item-details-label'>
          Name
      </div>
      <input class='item-details-editor-container editor' type="text" data-editorid='name'></input>

      <hr/>
      <div class='item-details-form-buttons'>
          <button data-action='save'>Save</button>
          <button data-action='cancel'>Cancel</button>
      </div>
  </div>


// called on menu item 'edit' click: 
function openDetails() {

    var selectedRows = grid.getSelectedRows();
    var modal = $("#itemDetailsTemplate");
    modal.css('visibility','visible');        

    modal.keydown(function(e) {
        if (e.which == $.ui.keyCode.ENTER) {

            // update all rows with current values
            batchEdit(modal, selectedRows);
            modal.css('visibility','hidden');
      }
    });

    modal.find("[data-action=save]").click(function() {
          // update all rows with current values
          batchEdit(modal, selectedRows);
          modal.css('visibility','hidden');
    });
}

function batchEdit(modal, selectedRows) {

     var textname = modal.find("[data-editorid=name]");

        dataView.beginUpdate();
        for (row in selectedRows){

              var dataItem = dataView.getItem(row);
              dataItem[textname.attr("data-editorid")] = textname.val();
              dataView.updateItem(dataItem.id, dataItem);

          }

      dataView.endUpdate();

    }

 }