基于下拉框选择输出隐藏输入

Question

我试图根据用户在下拉框中的选择输出四个隐藏输入。

<label>Neighborhood:</label> 
<select id="district"> 
    <option value="">- Select -</option> 
    <option value="warehouse">Warehouse District</option> 
    <option value="gateway">Gateway District</option> 
    <option value="tremont">Tremont</option> 
    <option value="shoreway">Detroit Shoreway</option> 
</select> 

例如，如果用户选择仓库区，则将这些隐藏的输入添加到表单中。

<input type="hidden" name="idx-q-LatitudeMax" value="41.50534740463771" /> <input type="hidden" name="idx-q-LatitudeMin" value="41.49729607499309" /> <input type="hidden" name="idx-q-LongitudeMin" value="-81.70605182647705" /> <input type="hidden" name="idx-q-LongitudeMax" value="-81.69352054595947" />

我已经找到了一些解决方案，以应对不断变化的一个值，但我需要输出的所有四个。

任何帮助，将不胜感激

Answer 1

“type属性不能改变（IE安全模型）。” 看到这个change type of input field with jQuery

或者，你可以做到这一点

添加一个类你输入这样

<input class="hidden warhouse" name="idx-q-LatitudeMax" value="41.50534740463771"/> 
<input class="hidden warhouse" name="idx-q-LatitudeMin" value="41.49729607499309"  /> 
<input class="hidden warhouse" name="idx-q-LongitudeMin" value="-81.70605182647705" /> 
<input class="hidden warhouse" name="idx-q-LongitudeMax" value="-81.69352054595947" /> 

隐藏CSS类有“显示：无”

的变化首先隐藏所有然后显示你想要的那个

$('#district').change(function(){ 
$('input.hidden').hide() 
if($(this).val() == "warehouse"){ 
    $("input.warehouse").show() 
} 
})