Question

当我点击一次按钮时，我无法发射一个事件。双击一个按钮会使我的事件发生。

我在这里使用了角度js和jQuery。我没有得到，我出错的地方。任何人都可以帮我解决这个问题......

我的js代码：

   var app = angular
            .module('Home', [ 'ngAnimate', 'ui.bootstrap', 'ngRoute' ]);
    app.config([ '$routeProvider', function($routeProvider) {
        $routeProvider.when('/basic', {
            controller : 'Sample',
            templateUrl : 'html/basic.html'
        }).when('/features', {
            controller : 'Sample',
            templateUrl : 'html/basic.html'
        })
    } ]);
    app.controller('Sample', function($scope) {

        $scope.getFilenameFromPath = function(filename) {
                return filename.split("/")[1].split(".")[0];
        }

            $('#hideDiv').click(function() {
                    $('#diva').hide();
            })

    });

我的HTML代码：

<a  href="#/basic"><button id="hideDiv" style="margin-left: 22px; background-color: #73AD21">Basic</button></a>

<a href="#/features"><button id="showDiv" style="margin-left: 22px; background-color: #73AD21">+Features</button></a>



    <div id="diva" class="subdiv">
     <div style="margin-top: 15px; display: inline-block"
                ng-repeat="advanceimage in advanceimages">
      <img width=40 height=50 style="margin-left: 12px;" ng-src="{{advanceimage}}" /> 
      <br>
      <span style="margin-left: 12px;">{{getFilenameFromPath(advanceimage)}}</span>
     </div>
    </div>

Answer 1

尝试调查debounce或throttle技术 - http://underscorejs.org/#debounce或http://underscorejs.org/#throttle。

Throttle - 创建并返回传递函数的新的受限制版本，当重复调用时，每隔等待毫秒最多只调用一次原始函数。对于速度限制事件非常有用，这些事件的发生速度比您能跟上的速度要快。

Answer 2

以下是如何使用ngHide：

的示例

＆＃13;

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.hideDiva = false;
  $scope.toggle = function() {
    $scope.hideDiva = !$scope.hideDiva;
  };
});

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <button ng-click="toggle()">Hide/show</button>
  <div>
    <img ng-hide="hideDiva" src="http://media.mydogspace.com.s3.amazonaws.com/wp-content/uploads/2013/08/puppy-500x350.jpg">
  </div>
</body>

</html>

＆＃13;

如果您对此有任何疑问，请告诉我。

如何避免单击按钮两次以在jquery中触发事件

2 个答案: