獲取表上按ENTER的元素

當我點擊特定的元素（即我的表中的每一行）我得到我的對象，但我想在enter上的那個元素。下面的代碼會讓你更清楚，獲取表上按ENTER的元素

這是我的目標

var test = [{"name": "Ravi","age": 15}, {"name": "Shaul","age": 25}];

這裏是我的HTML表格

<table id="mymthelptable" ng-show="getTableValue" class="table table-bordered table-responsive table-hover add-lineheight table_scroll" arrow-selector> 
    <thead> 
     <tr> 
      <th ng-repeat="(key, value) in test[0]"> 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="item in test | filter: searchText" ng-dblclick="setElement(item);"> 
      <td ng-hide="columnToHide.indexOf(key) !== -1" ng-repeat="(key, value) in item"> 
       {{value}} 
      </td> 
     </tr> 
    </tbody> 
</table>

這裏是我的js 我寫了一個指令

app.directive('arrowSelector', ['$document', function($document) { 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs) { 
      // This function fires on double click of each row element 
      scope.setElement = function(element) { 
        console.log(element) // Here i get the particular object like {"name" : "Ravi","age" : 15} if i click on first row 
       } 
       // This function fires on press enter of each row element 
      $document.bind('keydown', function(e) { 
       if (e.which == 13) { 
        console.log(e) // Here i want the object {"name" : "Ravi","age" : 15} like the upper one but i did not get that 
        alert("wait"); 
       } 
      }); 
     } 
    }; 
}]);

來源

2016-12-27 Parshuram Kalvikatte

keydown事件是否會觸發？ e.which = 13火嗎？ ypo有console.log之後嗎？ –

雅火它，但我沒有得到對象 –

上面的代碼'scope.setElement'是否工作？ –

可以使用NG-的keydown而不是指令，並使用製表指數給予重點要點擊進入的元素，下面是一個工作片斷

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 
<head> 
 
<meta charset="ISO-8859-1"> 
 
<title>Insert title here</title> 
 
<script 
 
\t src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"></script> 
 
</head> 
 
<body> 
 
\t <table id="mymthelptable" class="" style="border: 1px solid black" 
 
\t \t ng-controller="MyCtrl"> 
 
\t \t <thead> 
 
\t \t \t <tr> 
 
\t \t \t \t <th ng-repeat="(key, value) in test[0]"></th> 
 
\t \t \t </tr> 
 
\t \t </thead> 
 

 
\t \t <tbody> 
 
\t \t \t <tr ng-repeat="item in test | filter: searchText" 
 
\t \t \t \t ng-dblclick="setElement(item);"> 
 
\t \t \t \t <td ng-repeat="(key, value) in item" 
 
\t \t \t \t \t ng-keydown="onkeydown(item,$event)" tabindex="0">{{value}}</td> 
 
\t \t \t </tr> 
 
\t \t </tbody> 
 
\t </table> 
 
\t <script> 
 
\t \t var app = angular.module('myApp', []); 
 

 
\t \t app.controller('MyCtrl', [ '$scope', function($scope) { 
 
\t \t \t $scope.test = [ { 
 
\t \t \t \t "name" : "Ravi", 
 
\t \t \t \t "age" : 15 
 
\t \t \t }, { 
 
\t \t \t \t "name" : "Shaul", 
 
\t \t \t \t "age" : 25 
 
\t \t \t } ]; 
 
\t \t \t $scope.setElement = function(element) { 
 
\t \t \t \t console.log(element) 
 
\t \t \t } 
 
\t \t \t $scope.onkeydown = function(item, $event) { 
 
\t \t \t \t console.log("get item " + item.name); 
 
\t \t \t \t console.log("get which" + $event.which) 
 
\t \t \t \t if ($event.which == 13) { 
 
\t \t \t \t \t alert("wait"); 
 
\t \t \t \t } 
 

 
\t \t \t } 
 
\t \t } ]); 
 
\t </script> 
 
</body> 
 
</html>

來源

2016-12-27 12:16:52 GraveyardQueen

哇，tabindex做了什麼 –

它給了我TypeError：ngModelCtrl爲null –

通常tab選項索引將是必須按到達該元素的選項卡數量，但在這種情況下tab選項是設置爲0以將焦點分配給每個td – GraveyardQueen

獲取表上按ENTER的元素

回答

相關問題