如果选择了最后一个下拉选项，则显示输入框

Question

如果选择了选择菜单中的最后一个选项，我想显示otherBox。我不想基于值来执行此操作，因为值会更改，但是我想在选择菜单中选择最后一个选项。 这是我尝试过的：

jQuery('select#dropdown').change(function () {
if ($('select#dropdown option:last').attr("selected", "selected")) {
	$('#otherBox').show();
} else {
$('#otherBox').hide();	
}
});

#otherBox {
display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<select id="dropdown">
<option>Test</option>
<option>Test2</option>
<option>Other</option>
</select>

<div id="otherBox">
test
</div>

Answer 1

此代码根据是否选择了最后一个选项使用切换来隐藏/显示。

查找搜索子级 是返回布尔值，并且：selected 确定是否选择了该选项

对于 attr ，传递两个值时，实际上是将attr（第一个值）设置为第二个值。因此，您的if语句实际上并未对其进行检查，而是始终将最后一个选项设置为selected。

jQuery('select#dropdown').change(function () {
$('#otherBox').toggle($(this).find("option:last").is(":selected"));	
});

#otherBox {
display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<select id="dropdown">
<option>Test</option>
<option>Test2</option>
<option>Other</option>
</select>

<div id="otherBox">
test
</div>

Answer 2

也许这会对您有所帮助。

jQuery('select#dropdown').change(function () {
var checkOther = $('select#dropdown').val();
if ( checkOther == 'other' ) {
	$('#otherBox').show();
} else {
$('#otherBox').hide();	
}
});

#otherBox {
display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="dropdown">
<option value='Test'>Test</option>
<option value='Test2'>Test2</option>
<option value='other'>Other</option>
</select>

<div id="otherBox">
test
</div>