将数组[index]传递给函数

时间:2017-05-25 13:41:34

标签: javascript

function setclass(element, classname) {
    console.log("event");
    console.log(element);
    element.classList.add(classname);   
    console.log(element.outerHTML);
}

var tpa = document.querySelectorAll("#topnav a");

for(var i=0; i<tpa.length; i++) {
    tpa[i].onclick = () => setclass(tpa[i], "current");
}

我不明白为什么元素没有通过setclass(tpa[i],...)传递给setclass。 console.log(element)记录“undefined”,后面的所有内容都失败,因为元素未定义。

另一方面,这可以按预期工作:

var tpa = document.querySelectorAll("#topnav a");
tpa[0].onclick= () => setclass(tpa[0], "current");

2 个答案:

答案 0 :(得分:2)

;(function(angular) {
    angular.module('myApp.directives')
        .directive('myExample', myExample);

    myExample.$inject = ['$timeout'];

    function myExample($timeout) {
        return {
            restrict: 'A',
            scope: {
                myExample: '&',
                ngHref: '='
            },
            link: function(scope, element, attrs) {
                element.on('click', function(event) {
                    event.preventDefault();

                    scope.myExample().then(function() {
                        $timeout(function() {
                            scope.$apply();
                            var target = attrs.target || '_blank';
                            var url = scope.ngHref;
                            angular.element('<a href="' + url + '" target="' + target + '"></a>')[0].click();
                        });
                    });
                });
            }
        };
    }
})(angular);

onclick将在你的循环迭代后发生。因此tpa [i]将指向最后一个元素。您可以通过上面的代码中的IIFE绑定,或者使用上下文:

;(function(angular) {
    'use strict';

    angular.module('myApp.controllers').controller('HomeController', HomeController);

    HomeController.$inject = ['$scope', '$q'];

    function HomeController($scope, $q) {
        $scope.url = 'http://yahoo.com';
        $scope.someFunction = function() {
            var deferred = $q.defer();
            $scope.url = 'http://google.com';

            deferred.resolve('');
            return deferred.promise;
        };
    }
})(angular);

答案 1 :(得分:1)

Bind创建一个新函数,将其设置为传递给bind()的第一个参数。

&#13;
&#13;
function setclass(element, classname, event) {
    console.log(event);
    console.log(element);
    element.classList.add(classname);   
    console.log(element.outerHTML);
}
var tpa = document.querySelectorAll("#topnav a");
var i,
    len = tpa.length;
for(i=0; i<len; i+=1) {
  tpa[i].onclick = setclass.bind(this, tpa[i], "current");
}
&#13;
<div id="topnav">
  <a>sfdg</a>
  <a>sfdg</a>
  <a>sfdg</a>
  <a>sfdg</a>
  <a>sfdg</a>
  <a>sfdg</a>
</div>
&#13;
&#13;
&#13;