Question

我有一个用AngularJS和Bootstrap开发的SPA。用户可以输入用户名和密码登录应用程序。我想允许这样做，在输入用户名和值后，按ENTER键将触发登录过程，就好像点击了Login按钮一样。我正在使用的代码是：

    Charge_Enter_Event_for_Login = function () {
        $(document).ready(function(){
            $('#Username').keypress(function(e){
                if(e.keyCode==13) {
                    $('#Do_Login').click();
                    return false;
                }
            });

            $('#Password').keypress(function(e){
                if(e.keyCode==13) {
                    $('#Do_Login').click();
                    return false;
                }
            });
        });
    }

    Charge_Enter_Event_for_Login() ;

（元素Do_Login是可以点击的按钮。）

第一次运行正常。但是，如果我注销，则不再触发该事件，除非我使用浏览器的重新加载按钮。

我还尝试在注销功能中调用函数Charge_Enter_Event_for_Login()，但没有结果。

任何建议都将不胜感激。

Answer 1

您需要将{em> angularjs 指令ng-submit与form元素一起使用。你的代码看起来非常原始。请首先浏览角度站点，了解角度指令的工作原理。此外，如果你有angularjs，你不需要使用 jQuery ，因为你可以使用angular提供的双向绑定。我为你的方案here创建了一个jsbin。请使用它，并尽可能多地尝试使用angularjs指令

Answer 2

如果#Do_Login按钮是<input type="submit">标记，那么当焦点位于<input type="text">或<input type="password">元素上时，按下ENTER时会自动触发该标记。

要回答这个问题，我的猜测是：登录成功后，您可能会以某种方式隐藏登录表单？可能是通过销毁form DOM对象。如果稍后重新创建form以在注销后再次显示登录表单，则需要再次附加事件，因为它是一个新的DOM对象。

Answer 3

看起来您的事件仅在pageload上绑定。你真的不应该使用jquery来做这种事情。

您有两种可能的解决方案：

在输入中使用指令：

 angular.module('yourAppName')
    .directive('submitAction', function () {
        return function (scope, element, attrs) {
            element.on("keypress", function (e) {
                e.preventDefault();

                if(e.keyCode === 13) {
                    scope.$apply(function () {
                        scope.$eval(attrs.submitAction);
                    });
                }
            });
        };
    });

所以你的输入看起来像这样：

<input type="text" id="Username" submit-action="functionToExecute()">

或使用angular ng-keypress指令：

<input type="text" id="Username" ng-keypress="functionToExecute($event)">

使用此解决方案，您需要检查函数中keyCode的值。

如何在javascript中为ENTER事件充值

3 个答案: