jquery结合了类似的代码

Question

我有很多jquery点击函数，它们非常相似，如何将它们合并为较短的代码。 （使用regex或使用array foreach？）

$(".menu").live('click', function() { 
    var value = $(this).html(); 
    $('#menu').html(value); 
}); 

$(".nav").live('click', function() { 
    var value = $(this).html(); 
    $('#nav').html(value); 
}); 

$(".list").live('click', function() { 
    var value = $(this).html(); 
    $('#list').html(value); 
}); 

Answer 1

这应该这样做：

var elems = ["menu", "nav", "list"]; 
$.each(elems, function(i, elem){ 
    $("."+elem).live('click',function(){ 
     var value = $(this).html(); 
     $('#'+elem).html(value); 
    }); 
}); 

1. 创建元素的列表。
2. 遍历它使用$.each
3. 函数的第二个参数等于元素列表（menu，nav，..）

Answer 2

Rob的答案肯定是投票机，值得，但我只是想说有时你想限制两个元素之间的任意连接。为什么元素X有一个类必须与元素Y的ID相同？这是非常随意的，并且可能会让人稍后想出来。

可以代替接近它像这使其更加坚固：

<a href="#" class="foo" data-your-data-attr="alice">alice</a> 
<a href="#" class="foo" data-your-data-attr="bob">bob</a> 
<a href="#" class="foo" data-your-data-attr="sue">sue</a> 

现在你的JS超成为直接的和简单：

$(".foo").live('click',function(){ 
    var value = $(this).html(); 
    var yourDataAttr= $(this).data('yourDataAttr'); 
    $('#' + yourDataAttr).html(value); 
});