我有一个表单,其中一个字段是选择字段,有 5 个选项。当单击第五个选项时,我想要显示一个隐藏的 div。我希望点击其他 4 个按钮时不会发生任何事情。
它适用于 FireFox,但不适用于其他地方。经过一番研究后,Chrome/IE 似乎不允许您使用 select 进行 onClick 触发。到目前为止,所有建议都是在整个 Select 上使用 onChange,但我无法弄清楚如何在使用 onChange 单击第五个选项时触发代码。任何帮助将不胜感激。
默认情况下,自定义属性设置为display: none;。我希望 div id'd *custom_proptions* 在单击选项 id'd *custom_proptions_option* 时显示,并且还希望它在先显示然后单击其他选项之一时重新隐藏自身。
<div class="proptions_container">
<select name="proptions" id="proptions" class="proptions">
<option value="0" class="default_proptions" id="choose_prompt">Choose your Proptions…</option>
<option value="1" class="default_proptions">Yes <strong>or</strong> No</option>
<option value="2" class="default_proptions">Before <strong>or</strong> On/After</option>
<option value="3" class="default_proptions">More than <strong>or</strong> Less than</option>
<option value="4" class="default_proptions">Better <strong>or</strong> Worse</option>
<option value="5" id="custom_proptions_option">A <strong>or</strong> B (customize below)</option>
</select>
<div id="custom_proptions">
<input name="proption_1" type="text" class="text" id="proption_1" placeholder="First Proption" />
<span id="custom_or">or</span>
<input name="proption_2" type="text" class="text" id="proption_2" placeholder="Second Proption" />
</div>
<script>
$('option#custom_proptions_option').click(function() {
$('div#custom_proptions').slideDown('slow');
});
$('option.default_proptions').click(function() {
$('div#custom_proptions').slideUp('slow');
});
</script>
</div>
最佳答案
在更改事件中执行此操作,但仅限于所需的值:
<script>
$('#proptions').change(function() {
if ($(this).find(':selected').val() === '5') {
$('div#custom_proptions').slideDown('slow');
} else {
$('div#custom_proptions').slideUp('slow');
}
});
</script>
关于jquery - 尝试获取 jQuery 事件以在选择/选项表单上触发 onClick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6540541/