コードの最適化 - 複数のイベント

Question

このコードを書くための最良のケースがある場合、私はちょうど思ったんだけど：

$('#set_duration_30').click(function(event) { 
    $('#duration').val(30); 
    }); 

    $('#set_duration_60').click(function(event) { 
    $('#duration').val(60); 
    }); 

    $('#set_duration_90').click(function(event) { 
    $('#duration').val(90); 
    }); 

    $('#set_duration_120').click(function(event) { 
    $('#duration').val(120); 
    }); 

Answer 1

は、たとえばdurationsetterのために、あなたの要素のCSSクラスを与えます。また、値を含む属性を与えます（例：data-duration）。

すなわち

<input type="button" class="durationsetter" data-duration="30" /> 

次に、あなたのjQueryのは、次のようになります。

$('.durationsetter').click(function(e) { 
    $('#duration').val($(this).attr('data-duration')); 
});