javascript - jQuery：在特定条件下显示文本框

Question

当用户选择美国时，我显示美国城市的文本框，但如果用户取消选择美国怎么办？

如果没有隐藏城市文本框 ，我如何检查是否选择了美国。 我的脚本是：

<tr>
<td nowrap="nowrap">
<label for="countryId">Countries</label>
</td>
<td>
<select id="countryId" onchange="usCity();" multiple="multiple" name="countryId[]">
<option value="1">United States</option>
<option value="2">United Kingdom</option>
<option value="3">Australia</option>
<option value="4">UAE</option>
<option value="5">Denmark</option>
<option value="6">Czech Republic</option>
<option value="7">Brazil</option>
<option value="8">Singapore</option>
<option value="9">Pakistan</option>
<option value="10">Germany</option>
<option value="11">India</option>
<option value="12">SriLanka</option>
<option value="13">UK</option>
<option value="14">Algeria</option>
<option value="15">Andorra</option>
<option value="16">Caneda</option>
<option value="17">HongKong</option>
</select>
</td>
<td valign="top">
</tr>
<tr id="usCitytr" style="display: none;">
<td nowrap="nowrap">
<label for="USCity">US City Name</label>
</td>
<td colspan="3">
<input id="USCity" type="text" value="" name="USCity">
</td>
</tr>

function usCity()
    {
        if ($("#countryId option:selected").text() == 'United States' || $("#countryId option:selected").text() == 'US'){
            $("#usCitytr").show();
        }
    }

我在每次选择时都必须获取数组结构中的所有选定值，然后使用循环查找“US”（如果找到），然后显示“US City”文本框，否则隐藏。为此，我使用

alert($('select#countryId').text());

但它返回组合框中存在的所有值。然而

alert($('select#countryId').val());

仅返回选定的值，但我需要 'US' 而不是存在 'US' 的索引，因为 'US' 可能在任何地方。

Answer 1

<option id="opt_US" value="1">United States</option>


if ($("#opt_US").is(":selected") {
    $("#usCitytr").show();
} else {
    $("#usCitytr").hide();
}

Answer 2

    function usCity()
    {
        if ($("#countryId option:selected").text() == 'United States' || $("#countryId option:selected").text() == 'US'){
            $("#usCitytr").show();
        } else {
            $("#usCitytr").hide();
        }
    }