IONIC V1：Form Keydown Enter 在最后一个字段上触发，但不在设备内的第一个字段上触发

Question

我有一个 Ionic 应用程序，其页面包含多个字段的表单。除了最后一个输入字段 KeyPress Enter 只会将焦点移动到下一个字段。我希望当焦点位于表单中的任何字段时触发 Enter 键。

<ion-view view-title="Search">
  <ion-content class="has-header">
    <form focus>
      <div class="list list-inset">
        <label class="item item-input">
          <input ng-model="searchForm.name" name="fieldName" type="text" placeholder="Nome" ng-minlength="2" ng-maxlength="70">
        </label>
        <label class="item item-input">
          <input ng-model="searchForm.city" name="fieldEmail" type="email" placeholder="E-mail" ng-maxlength="50">
        </label>
      </div>
    </form>
  </ion-content>
</ion-view>

在指令中：

.directive('focus', function () {
    return {
        restrict: 'A',
        link: function ($scope, element, attrs) {

            element.bind('keydown', function(e) {

              var code = e.keyCode || e.which;
              console.log(code);
              if (code === 13) {
              alert("enter pressed");
                //element.next()[0].focus();

              }
              e.preventDefault();
            });
        }
    }
})

因此，在第一个字段中，当按下 enter 时，不会触发 keydown enter(code = 13)，但在第二个或最后一个字段中，keydown enter 事件会被正确触发。

当焦点位于表单上的任何字段上时，如何在用户按下设备键盘上的 Enter 时触发事件。

Answer 1

尝试删除表单中的 "focus" 属性并将其放入每个输入中。

像这样：

<ion-view view-title="Search">
  <ion-content class="has-header">
      <div class="list list-inset">
        <label class="item item-input">
          <input ng-model="searchForm.name" name="fieldName" type="text" placeholder="Nome" ng-minlength="2" ng-maxlength="70" focus>
        </label>
        <label class="item item-input">
          <input ng-model="searchForm.city" name="fieldEmail" type="email" placeholder="E-mail" ng-maxlength="50" focus>
        </label>
      </div>
  </ion-content>
</ion-view>

希望对您有所帮助！

IONIC V1：Form Keydown Enter 在最后一个字段上触发，但不在设备内的第一个字段上触发

IONIC V1: Form Keydown Enter Fired on last field but not on the first field inside Device

angularjs

ionic-framework

ionic2