Question

我几乎没有使用Jquery（甚至是Javascript）的经验，但经过一些研究后，似乎我需要它。我有一个HTML表单来选择一个国家和地区，但我需要选择国家来确定填充区域列表的内容。

<select name="search_country" id="scid">
  <option value="">Select a country</option>
  <option value="cyprus">Cyprus</option>
  <option value="turkey">Turkey</option>
  <option value="greece">Greece</option>
</select>
<select name="search_region" id="srid">
  <option value="">Select a region</option>
</select>

浏览了这个网站后，我发现了一些几乎完全有效的代码，但是当选择了一个国家/地区时，只有一个地区（顶部选项）显示在列表中。

$(function(){
 $("#scid").change(function(){
var options = '';
if($(this).val().indexOf('cyprus') > -1) {
    options = '<option value="paphos">Paphos</option>';
              '<option value="larnaca">Larnaca</option>';
              '<option value="nicosia">Nicosia</option>';
              '<option value="agia_napa">Agia Napa</option>';
}
else if ($(this).val().indexOf('turkey') > -1) {
    options = '<option value="ankara">Ankara</option>';
}
    else if ($(this).val().indexOf('greece') > -1) {
    options = '<option value="athens">Athens</option>';
              '<option value="rhodes">Rhodes</option>';
}
$('#srid').html(options); }); });

我可以做什么，以便在选择国家/地区时，所有相应的区域都会填充第二个下拉列表？

感谢。

Answer 1

这不是

options = '<option value="paphos">Paphos</option>';
          '<option value="larnaca">Larnaca</option>';

这些是两个单独的陈述。通过仅修改空白来更清楚地说明：

options = '<option value="paphos">Paphos</option>';

'<option value="larnaca">Larnaca</option>';

第一个将options变量设置为该一个字符串。第二个语句本身只是一个字符串，没有做任何事情。因此，在执行这两个语句之后，options只被设置为第一个值。

我认为您希望连接您的值：

options = '<option value="paphos">Paphos</option>' +
          '<option value="larnaca">Larnaca</option>';

或者，或者：

options = '<option value="paphos">Paphos</option>';
options += '<option value="larnaca">Larnaca</option>';

哪个会在两个语句中执行连接。你如何选择这样做取决于你认为哪些更易读，更容易维护，真的。

如何通过Jquery

1 个答案: