Функция anonymus внутри функции перезаписывается при последующих вызовах?

Question

Я пытаюсь добавить общую простую функцию, которая показывает/скрывают связанные намеки текстов полевых формы, когда поле получает/теряет фокус:

 function capFirstLetter(string) { 
      return string.charAt(0).toUpperCase() + string.slice(1); 
     } 

     function pairFieldHint(fieldName) { 
      hintField = $('#hint' + capFirstLetter(fieldName)); 
      fieldName = $('#' + fieldName); 
      hintField.toggle(); 
      fieldName.focus(function() { 
       hintField.show('fast'); 
      }); 
      fieldName.blur(function() { 
       hintField.hide('fast'); 
      }); 
     } 

     pairFieldHint('companyname'); 
     pairFieldHint('address'); 

Я думал, что я могу написать его один раз и использовать его для любого аналогичного поля/намек пара на основе конкретного именования:

<label class="required">Company Name</label><input type="text" name="companyname" id="companyname" /> 
<div class="field-hint" id="hintCompanyname">Invoice to this name</div> 

<label class="required">Address</label><input type="text" name="address" id="address" /> 
<div class="field-hint" id="hintAddress">Eg. New York, 6th ave 4.</div> 

проблема заключается в том, что даже если я нажимаю на поле COMPANYNAME, адрес намек получает показан/скрыт. Кажется, что последний вызов парыFieldHint отменяет любые предыдущие.

Смотрите в действии: http://jsfiddle.net/Kh62D/

Может функции Анонимус внутри получает всегда переписывается? Что должно быть не так?

Answer 1

Вы должны использовать var в функции, чтобы установить местные контекстные переменные (см http://jsfiddle.net/Kh62D/2/):

function pairFieldHint(fieldName) { 
    var hintField = $('#hint' + capFirstLetter(fieldName)); 
    var fieldName = $('#' + fieldName); 
    /* ...the rest of your code as before... */ 
} 

Когда вы опускаете var, это на самом деле создает свойство на window объекта. Таким образом, hintField = ... эквивалентен window.hintField = ..., когда вы опускаете var. Это практически то же самое, что и установка глобальной переменной.

Так как у вас это, каждый раз, когда pairFieldHint получил колл, было бы переопределить значения hintField и fieldname, что означает, что эти значения будут в конце концов все будет то, что в последний раз вы назвали его установить их (в вашем case, то есть значения, связанные с «адресом»).

При создании локальных переменных с помощью var они имеют соответствующую область видимости и видимости только внутри функции, поэтому вызов блока снова не перезаписывает переменные с того момента, когда вы вызывали функцию раньше.