使用ng-model of angularjs在输入上输入文本时滚动到页面顶部

Question

我有一个包含两个字段的表单，用户名和密码，两个字段都绑定了ngModel

<form method="POST" name="loginForm" novalidate class="loginForm">
    <input ng-required="true" ng-model="loginRequest.UserName" class="textControls userCtrl" type="text" name="UserName" id="id_username" />
    <input ng-required="true" ng-model="loginRequest.Password" type="password" name="Password" id="id_password"/>
    <button  type="submit" id="submitLogin" class="blueBtn">Ingresar</button>
</form>

我的问题是在移动设备中的每个字段上键入前两个字母时，页面在iphone中滚动到顶部而失去了该字段的焦点。将ng-model移除到输入字段时，此行为会消失。

Answer 1

您的方案看起来像表单提交会触发页面刷新。默认情况下，如果您不手动停止事件传播，则在使用表单提交时它将刷新页面。

如果您使用表单，只需向ng-click添加<button>指令，然后致电event.preventDefault();。

如果您使用$http服务发布表单数据，则可以自动避免这种情况。