выпадающее меню html формы персонализированной категории

Question

у меня есть следующая часть кода выпадающего меню

<p>
<label for='Select a Category '>Select a Category<font color="red"><strong>*</strong></font>: </label></p> 
<p><div id='contactform_category_errorloc' class='err'></div>

  <select name="category" class="input">
    <option value="0" selected="selected">
      [choose yours]
    </option>
    <option value="Arts and entertainment">Arts and entertainment</option>
    <option value="Automotive">Automotive</option>
    <option value="Business">Business</option>
    <option value="Computers">Computers</option>
    <option value="Games">Games</option>
    <option value="Health">Health</option>
    <option value="Internet">Internet</option>
    <option value="News and Media">News and Media</option>
    <option value="Recreation">Recreation</option>
    <option value="Reference">Reference</option>
    <option value="Shopping">Shopping</option>
    <option value="Sports">Sports</option>
    <option value="World">World</option>
  </select>
</p>

Я хочу добавить в раскрывающееся меню параметр со значением: «пользовательский», чтобы при выборе этого параметра он отображался под пустым полем в качестве входного текста, где я мог добавить свой персонализированный текст, чтобы я мог вставить персонализированную категорию возможно?

Answer 1

может быть, вы имеете в виду что-то вроде этого: http://jsbin.com/ubihuw/edit#javascript,html так что в php или что-то еще вы можете проверить в поле "my_own_text" ... не знаю, что именно вы будете делать;)

js:

$('.input').change(function()
{
  if($(this).attr('value') == "0") {
    $('#choose_own_text').append('<input type="text" id="my_own_text" name="my_own_text" value="Please type in .." />');
  } else {
    $('#choose_own_text').empty();
  }
});

ваш код ...

<p><div id='contactform_category_errorloc' class='err'></div>

  <select name="category" class="input">
    <option value="0" selected="selected">
      [choose yours]
    </option>
    <option value="Arts and entertainment">Arts and entertainment</option>
    <option value="Automotive">Automotive</option>
    <option value="Business">Business</option>
    <option value="Computers">Computers</option>
    <option value="Games">Games</option>
    <option value="Health">Health</option>
    <option value="Internet">Internet</option>
    <option value="News and Media">News and Media</option>
    <option value="Recreation">Recreation</option>
    <option value="Reference">Reference</option>
    <option value="Shopping">Shopping</option>
    <option value="Sports">Sports</option>
    <option value="World">World</option>
  </select>
  <div id="choose_own_text"></div>
</p>