javascript - 如何让我的点击捕捉器工作？

Question

我正在尝试创建一个简单的点击捕捉器，如果您点击 .image-class，javascript 将从另一个类名为 .btn 的元素获取 href > 并将您送到目的地。虽然我在第 7 行和第 10 行不断收到错误消息，说 undefined 不是函数。我该如何进行这项工作？

<script>
var ClickCatcher=
{
    init:function(){
        var link = jQuery('.btn')[1].href;
        var imgCatch = jQuery('.image-class');
        imgCatch.addEventListener("click", ClickCatcher.clickListener, false);
    },
    clickListener:function(){
        window.location = link;
    }
};
ClickCatcher.init();
</script>

Answer 1

你可以通过一个简单的点击事件用 jquery 做到这一点

jQuery('.image-class').on('click', function (){
    window.location = jQuery('.btn').eq(1).attr('href');
});

但是如果你仍然想用你现有的方式写作，你可以这样做:

var ClickCatcher = {
    init: function () {
        jQuery('.image-class').on('click', function (){
            window.location = jQuery('.btn').eq(1).attr('href');
        });
    }
};

ClickCatcher.init();

只需确保在 dom 加载后触发 init 方法。

更新:它的一个问题是您在代码中编写了目标等而不是传递它，因此它很难重用，您最好这样做:

var ClickCatcher = {
    init: function ($button, loc) {
        $button.on('click', function (){
            window.location = loc;
        });
    }
};

ClickCatcher.init(jQuery('.image-class'), jQuery('.btn').eq(1).attr('href'));

这样内部工作就与 dom 分开了(因为您将 dom 依赖项传递给函数。