Le dernier JSFiddle d'Alen Saqe n'a pas basculé pour moi sur Firefox, j'ai donc pensé fournir une solution de contournement html/javascript simple qui fonctionnera bien dans les formulaires (en ce qui concerne la soumission) jusqu'au jour où la balise datalist est acceptée par tous les navigateurs/appareils. Pour plus de détails et le voir en action, rendez-vous sur : http://jsfiddle.net/6nq7w/4/ Remarque : ne laissez aucun espace entre les frères et sœurs basculants !
<!DOCTYPE html>
<html>
<script>
function toggleField(hideObj,showObj){
hideObj.disabled=true;
hideObj.style.display='none';
showObj.disabled=false;
showObj.style.display='inline';
showObj.focus();
}
</script>
<body>
<form name="BrowserSurvey" action="#">
Browser: <select name="browser"
onchange="if(this.options[this.selectedIndex].value=='customOption'){
toggleField(this,this.nextSibling);
this.selectedIndex='0';
}">
<option></option>
<option value="customOption">[type a custom value]</option>
<option>Chrome</option>
<option>Firefox</option>
<option>Internet Explorer</option>
<option>Opera</option>
<option>Safari</option>
</select><input name="browser" style="display:none;" disabled="disabled"
onblur="if(this.value==''){toggleField(this,this.previousSibling);}">
<input type="submit" value="Submit">
</form>
</body>
</html>