Question

我想我已经花了太多时间看这个功能，只是试图找出干净利落的方法。

这是一个jQuery函数，它将click事件添加到具有div CSS类的任何click。单击div.click后，它会将用户重定向到其中找到的第一个链接。

function clickabledivs() {
    $('.click').each(
        function (intIndex) {
            $(this).bind("click", function(){
                window.location = $( "#"+$(this).attr('id')+" a:first-child" ).attr('href');
            });
        }
    );
}

代码很简单，虽然我很确定有更好的方法来实现它，特别是我正在使用的选择器：$( "#"+$(this).attr('id')+" a:first-child" )。一切看起来都很漫长。有任何想法吗？

如果您需要更多详细信息，请与我们联系。谢谢！

PS：我在这里找到了一些来自Project2k.de的非常好的jQuery基准测试参考： http://blog.projekt2k.de/2010/01/benchmarking-jquery-1-4/

Answer 1

根据您拥有的这些div.click元素的数量，您可能希望使用事件委派来处理这些点击。这意味着对所有具有click类的div使用单个事件处理程序。然后，在该事件处理程序中，您的回调基于事件源自div.click的行为。像这样：

$('#div-click-parent').click(function (event)
{
    var $target = $(event.target); // the element that fired the original click event
    if ($target.is('div.click'))
    {
        window.location.href = $target.find('a').attr('href');
    }
});

更少的事件处理程序意味着更好的扩展 - 更多div.click元素不会减慢您的事件处理速度。

Answer 2

使用jQuery 1.7 +优化委派

$('#div-click-parent').on('click', 'div.click', function () {
   window.location.href = $(this).find('a').attr('href');
});

Answer 3

为什么不在点击时绑定它们，而不是绑定所有点击加载？应该更加优化。

$(document).ready(function() {
   $('.click').click(function() {
        window.location = $(this).children('a:first').attr('href');
        return false;
    });
});

Answer 4

我可能会做类似的事情;

$('.click').click(function(e){
  window.location.href = $(this).find('a').attr('href');
});

jQuery - 将Click事件添加到Div并转到找到的第一个链接

4 个答案: