Избегайте дублирования функций в jQuery

Question

Эта функция написана дважды, чтобы сохранить состояние флажка, а также соответствующий текст div. Как мне написать код в функции один раз, а затем вызвать его дважды при событиях load и click соответственно?

$(document).ready(function() {
                    $("#bquote").load("quotes_in.php", function() { 

                    // a key prefix is used for the cookie/storage
                    var storedData = getStorage('com_mysite_checkboxes_'); 

                    $('div.check input:checkbox').bind('change',function(){
                    $('#ab_' + this.id).toggle($(this).is(':checked'));

                    // save the data on change
                    storedData.set(this.id, $(this).is(':checked')?'checked':'not');
                    }).each(function() {

                    // on load, set the value to what we read from storage:
                    var val = storedData.get(this.id);
                    if (val == 'checked') $(this).attr('checked', 'checked');
                    if (val == 'not') $(this).removeAttr('checked');
                    if (val) $(this).trigger('change');

                    });
                 });                 

            });



            $(function() {


            /*load quotes on click of link*/
            $("a#main")
                .click(function() {
                   $(this).addClass("current"); 
                   $("#bquote").load("quotes_in.php", function() {  

                    // a key prefix is used for the cookie/storage
                    var storedData = getStorage('com_mysite_checkboxes_'); 

                    $('div.check input:checkbox').bind('change',function(){
                    $('#ab_' + this.id).toggle($(this).is(':checked'));

                    // save the data on change
                    storedData.set(this.id, $(this).is(':checked')?'checked':'not');
                    }).each(function() {

                    // on load, set the value to what we read from storage:
                    var val = storedData.get(this.id);
                    if (val == 'checked') $(this).attr('checked', 'checked');
                    if (val == 'not') $(this).removeAttr('checked');
                    if (val) $(this).trigger('change');

                        });      
                });
            });

Answer 1

Вы можете объявить ее один раз как именованную функцию и вызвать ее дважды, например так:

$(function() {
  function loadQuotes() {
    $("#bquote").load("quotes_in.php", function() { 

      // a key prefix is used for the cookie/storage
      var storedData = getStorage('com_mysite_checkboxes_'); 

      $('div.check input:checkbox').bind('change',function(){
        $('#ab_' + this.id).toggle(this.checked);

        // save the data on change
        storedData.set(this.id, this.checked?'checked':'not');
      }).each(function() {

        // on load, set the value to what we read from storage:
        var val = storedData.get(this.id);
        if (val == 'checked') $(this).attr('checked', 'checked');
        if (val == 'not') $(this).removeAttr('checked');
        if (val) $(this).trigger('change');

      });
    });                 
  }
  $("a#main").click(function() {
    $(this).addClass("current"); 
    loadQuotes();
  });
  loadQuotes();  //call it once on load
});

Я также изменил $(this).is(':checked') на this.checked в приведенном выше примере, нет необходимости замедлять его,свойство DOM работает здесь:)