Ввод формы HTML с радио и текстом - выбор

Question

У меня есть область ввода текста, прикрепленная к переключателю в форме HTML, как показано здесь:

    <fieldset class="w100">
                        <div class="rowElem align-left">
                          <input type="radio" id="plan_height" name="plan_height" value="standard6'2&quot;" checked >
                          <label>Standard 6'2"</label>
                        </div>
                        <div class="rowElem align-left">
                          <input type="radio" id="other_text" name="plan_height" value="Other height" onclick="document.getElementById('other_height').focus();" >
                          <input type="text" id="other_height" name="plan_height" value="Enter custom height" onFocus="if(this.value=='Enter custom height') this.value='';" onBlur="if(this.value=='') this.value='Enter custom height';">
                          <label for="other_text">Other</label>
                        </div>
                       </fieldset>

Если пользователь выбирает второй параметр радио для «Другое», я бы хотел, чтобы текстовое поле автоматически было в фокусе, чтобы он мог ввести значение. Кроме того, если пользователь нажимает на текстовое поле для ввода значения, я бы хотел, чтобы для него автоматически был выбран переключатель.

Я пытался использовать onBlur, onChange или onKeyup для элемента формы, но не могу заставить его работать.

Answer 1

Вы пробовали событие onclick: onclick="document.getElementById('other_height').focus();"

Answer 2

Проверьте это http://jsfiddle.net/tzj6Z/7/

Для кросс-браузерной поддержки вам нужно будет добавить распознавание броузера, как это

if(navigator.userAgent.indexOf('Firefox')>=0) { // Firefox
  focus_event = 'focus';
} else if (navigator.userAgent.indexOf('Safari')) {  // Opera, Safari/Chrome
  focus_event = 'DOMFocusIn';
} else {  // IE
  focus_event = 'onfocusin';
}