Question

我的情景，如果我开始选择表td元素jan01，feb 01，mar 01，继续apri01，apri02，mar 02，feb 02。

选择表td然后将类更改为＆＃34; cellselect＆＃34;和选择的td元素＆＃34; datavalselet＆＃34; val添加一个数组，即$ scope.selectedCell = []和取消选择$ scope.unselectedCell = []中的td元素值。

它与http://plnkr.co/edit/cCsLf6g83Xhg72mePoFf?p=preview类似。但是，它基于td元素中的光标指针是唯一的选择。不是孔行和列。

请参阅http://jsfiddle.net/q4wcgbLq/12/

中的实施代码

此外，相同的功能还可以支持移动设备。

但是，我不想使用jquery和jquery ui可选功能以及mouser over和mouser-down事件。

如何在anguler js中执行此类型功能。或者它是否可能以角Js。

我尝试使用mousedown和mouseup事件，但它无法正常工作且不支持移动设备。

以其他方式执行此类型功能，并使用角度Js

在移动设备上工作

我怎么能做到这一点？或者请告诉我。

我在jsfiddle下面实现了一些代码。

在Viewhtml文件中

<div ng-app>
<div ng-controller="myselectctr"> 

<table class="cell-box-selection">
    <thead>
<tr>
<th ng-repeat="monlist in monthsarr">
    {{monlist}} 
</th>
    </tr>
    </thead>

<tr>

        <td class="days-val">01</td>
<td ng-repeat="val in valindaysarr " class="mainbox_{{$index}} cellselect" ng-class="{'cellselect': cellbox{{$index}}, 'uncellselect': !cellbox{{$index}}}" ng-click="selectioncell($index)" datavalselet="{{val}}01">{{val}}01</td>

</tr>
    <tr>

        <td class="days-val">02</td>
<td ng-repeat="val in valindaysarr track by $index" class="mainbox_{{$index*1+7}} smallcell cellselect" ng-class="{'cellselect': cellbox{{$index*1+7}}, 'uncellselect': !cellbox{{$index*1+7}}}" ng-click="selectioncell($index*1+7)" datavalselet="{{val}}02">{{val}}02</td>

</tr>
     <tr>

        <td class="days-val">03</td>
<td ng-repeat="val in valindaysarr track by $index" class="mainbox_{{$index*1+14}} smallcell cellselect" ng-class="{'cellselect': cellbox{{$index*1+14}}, 'uncellselect': !cellbox{{$index*1+14}}}" ng-click="selectioncell($index*1+14)" datavalselet="{{val}}03">{{val}}03</td>

</tr>

</table>  
    </div>
    </div>

在Controller.js

中

function myselectctr($scope) {

    $scope.selectedCell = [];

    $scope.unselectedCell = [];


    $scope.monthsarr = ['M/D','Jan','Feb','Mar','Apri', 'May', 'Jun', 'Jul'];

    $scope.dayscountarr = ['01','02','03','04', '05','06','07'];

    $scope.valindaysarr = ['jan','feb','mar','apri', 'may','jun','jul'];

    for(var i=0; i<49; i++){
        $scope.selectioncell = function(i){
                    $scope['cellbox'+i] = !$scope['cellbox'+i];
        }
    }

}

你能帮助我吗？

我如何在角度Js中连续选择表格td元素onhover光标指针

0 个答案: