Javascript 防止按钮被按下两次

我不熟悉JavaScript和AngularJS。我做了一个演示，我用modal做了一个简单的页面导航，所以当我点击一个按钮时，我会转到另一个页面。但我的问题是，当我两次点击这个按钮时，它会两次打开同一页。我已经使用了超时功能，但我不知道为什么它不能在我的演示中工作，我的代码如下

JavaScript

$scope.foo = function() {
        if ($scope.filterflg !== "1" ) {
            $scope.filterflg = "1";
             $scope.disabled = true;


            gallery.pushPage("filter.html", {
                params: FkCategory
            });

            $timeout(function() {
                console.log("====timeout occured===");
                $scope.filterflg = "0";
                  $scope.disabled = false;
            }, 3000);
        }
    };

$scope.foo = function() {
   $scope.disabled = true;
    gallery.pushPage("filter.html", {params:$scope.filteid});

$timeout(function() {
    console.log("======time out occured======");
    $scope.disabled = false;
}, 0);
};

HTML

   <span class="toolbar-button--quiet navigation-bar__line-height" ng-click="foo();" ng-disabled="disabled"
                  style="border: none; padding: 0 5px 0 0;">

   <span class="toolbar-button--quiet navigation-bar__line-height" ng-click="foo();" ng-disabled="disabled"
                  style="border: none; padding: 0 5px 0 0;">

---

setTimeout

不会修改作用域，因为它是一个本机JavaScript函数，将在AngularJS上下文之外运行，而在AngularJS上下文之外运行的代码正在更改AngularJS

作用域

将不会反映在UI上，直到您手动运行摘要循环

因此，您不应该使用

setTimeout

，而应该使用

$timeout

，它将为您运行一个摘要循环

用户能够点击按钮两次的另一个原因是您的超时时间

2000

ms（

2sec

）；如果你想减少的话，会立即产生效果

$timeout(function() {
    disabled = false;
}, 0);

---

您真的不应该在控制器中使用jquery选择器

您应该尝试使用有角度的声明方式-

JavaScript

$scope.foo = function() {
        if ($scope.filterflg !== "1" ) {
            $scope.filterflg = "1";
             $scope.disabled = true;


            gallery.pushPage("filter.html", {
                params: FkCategory
            });

            $timeout(function() {
                console.log("====timeout occured===");
                $scope.filterflg = "0";
                  $scope.disabled = false;
            }, 3000);
        }
    };

$scope.foo = function() {
   $scope.disabled = true;
    gallery.pushPage("filter.html", {params:$scope.filteid});

$timeout(function() {
    console.log("======time out occured======");
    $scope.disabled = false;
}, 0);
};

HTML

   <span class="toolbar-button--quiet navigation-bar__line-height" ng-click="foo();" ng-disabled="disabled"
                  style="border: none; padding: 0 5px 0 0;">

   <span class="toolbar-button--quiet navigation-bar__line-height" ng-click="foo();" ng-disabled="disabled"
                  style="border: none; padding: 0 5px 0 0;">

注意我是如何使用ng disabled指令而不是jquery操作的

---

祝您好运。

您可以从按钮中删除

单击
eventListener，可能是这样：
this.setAttribute（'ng-click'，''）foo（）
；请看我的编辑，它仍然不工作，超时发生，但没有达到我想要的。！您好，我使用了此链接，但我真的不知道如何在我的代码中应用它。@FireCandy您需要在控制器函数中注入
$timeout
依赖项..注入但未达到我的目标..：（没有任何错误，但我的问题是，当我两次单击该按钮时，同一页打开，然后当我返回上一页时，会显示一个模式，并且永远不会转到Shello请查看我编辑的问题，但它仍然单击了两次，然后转到下一页，我不希望……！：（请帮助。）