jquery-Как написать этот код в функцию

Question

У меня есть три модуля/сектоины, которые в основном делают то же самое с некоторыми незначительными отличиями. Я попытался записать основную часть в функцию jquery, поэтому я могу просто назвать ее по мере необходимости, но я не могу правильно ее структурировать. Может ли кто-нибудь показать мне, как структурировать это, пожалуйста?

Это часть мне нужно как отдельную функцию, а затем вызывается другими

var mytextareaFld = $('#ta_holdAll'); 
     var fld_1 = $('#firstname').attr('name')+': '+$('#firstname').val(); 
     var fld_2 = $('#lastname').attr('name')+': '+$('#lastname').val(); 
     var fld_3 = $('#street_number').attr('name')+': '+$('#street_number').val(); 
     mytextareaFld.val(fld_1 +'\n' + fld_2 +'\n' + fld_3); 

jsfiddle:http://jsfiddle.net/justmelat/v4sZb/

HTML/JQuery код ниже:

<form> 
    <p>First name: <input type="text" name="firstname" id="firstname" value="Paul"/></p> 
    <p>Last name: <input type="text" name="lastname" id="lastname" value="Ryan" /></p> 
<p>Street #: <input type="text" name="street_number" id="street_number" value="4605"/></p> 
<p>Address: <input type="text" name="address" id="address"/></p> 
<p>City: <input type="text" name="city" id="city" /></p> 
<p>State: <input type="text" name="state" id="state"/> 

<span id="myzip">Zip:</span> <input type="text" name="zip" id="zip" /> 
    <br /><br /> 
<span id="allInfo">All Info:</span> <textarea id="ta_holdAll" rows="10" cols="30"></textarea><div id="charCnt"></div><br /><br /> 
    <input type="button" value="Add to Field" id="addField"> 
</form> 

    $(document).ready(function(){ 
    $('#addField').on('click',function(){ 
     var mytextareaFld = $('#ta_holdAll'); 
     var fld_1 = $('#firstname').attr('name')+': '+$('#firstname').val(); 
     var fld_2 = $('#lastname').attr('name')+': '+$('#lastname').val(); 
     var fld_3 = $('#street_number').attr('name')+': '+$('#street_number').val(); 
     mytextareaFld.val(fld_1 +'\n' + fld_2 +'\n' + fld_3); 
    }); 

    $('#allInfo').on('click',function(){ 
     var mytextareaFld = $('#ta_holdAll'); 
     var fld_1 = $('#firstname').attr('name')+': '+$('#firstname').val(); 
     var fld_2 = $('#lastname').attr('name')+': '+$('#lastname').val(); 
     var fld_3 = $('#street_number').attr('name')+': '+$('#street_number').val(); 
     mytextareaFld.val(fld_1 +'\n' + fld_2 +'\n' + fld_3); 
     var $mytextareaFld = $('#ta_holdAll'); 
     var $outPutCount = $("#charCnt"); 
     var $ofText = " characters of 1000 remaining"; 
     var val = $mytextareaFld.val(); 
     var val2 = $outPutCount.text(val.length).append("<strong>"+$ofText+"</strong>"); 
    }); 

    $("#firstname,#lastname, #street_number").blur(function(){ 
     var mytextareaFld = $('#ta_holdAll'); 
     var fld_1 = $('#firstname').attr('name')+': '+$('#firstname').val(); 
     var fld_2 = $('#lastname').attr('name')+': '+$('#lastname').val(); 
     var fld_3 = $('#street_number').attr('name')+': '+$('#street_number').val(); 
     mytextareaFld.val(fld_1 +'\n' + fld_2 +'\n' + fld_3); 
    }); 
}); 

Answer 1

JS Fid DLE Demo: http://jsfiddle.net/lucuma/jmhmE/1/

$(document).ready(function(){ 

    function AddStuff(event) { 
      var mytextareaFld = $('#ta_holdAll'); 
     var fld_1 = $('#firstname').attr('name')+': '+$('#firstname').val(); 
     var fld_2 = $('#lastname').attr('name')+': '+$('#lastname').val(); 
     var fld_3 = $('#street_number').attr('name')+': '+$('#street_number').val(); 
     mytextareaFld.val(fld_1 +'\n' + fld_2 +'\n' + fld_3); 
    } 

    $('#addField').on('click', AddStuff); 

    $('#allInfo').on('click',function(event){ 
     AddStuff(event); 
     var $mytextareaFld = $('#ta_holdAll'); 
     var $outPutCount = $("#charCnt"); 
     var $ofText = " characters of 1000 remaining"; 
     var val = $mytextareaFld.val(); 
     var val2 = $outPutCount.text(val.length).append("<strong>"+$ofText+"</strong>"); 
    }); 

    $("#firstname,#lastname, #street_number").blur(AddStuff); 
});​