Question

我正在购买购物车的地址页面。有2个<select>个框，一个用于Country，一个用于Region。

有6个标准国家/地区可供选择，否则用户必须选择“其他国家/地区”。 <option>元素都有一个数值 - 其他国家是241.我需要做的是，如果用户选择其他国家，则隐藏区域<select>，并显示文本区域。

任何帮助很多人赞赏！

Answer 1

您需要将一个函数绑定到选择列表，以便在它更改时，您的函数决定是否应显示div。像这样的东西（~~未经测试，希望语法上接近~~）。 这是live example 。

$(document).ready( function() {
  $('#YourSelectList').bind('change', function (e) { 
    if( $('#YourSelectList').val() == 241) {
      $('#OtherDiv').show();
    }
    else{
      $('#OtherDiv').hide();
    }         
  });
});

Answer 2

这与this question的原理相同。您只需要连接到选择的更改，请检查val()和hide()/show() div。

Answer 3

在我看来，你真的不需要jQuery。

这个简单的JavaScript代码可以解决这个问题：

document.getElementById('country_id').onchange = function()
{
    if (this.options[this.selectedIndex].value == 241) {
        document.getElementById('region_id').style.display = 'block';
    } else {
        document.getElementById('region_id').style.display = 'none';
    }
}

value适用于大多数浏览器，但是，对于较旧的浏览器，您需要select.options[select.selectedIndex].value。我更新了我的剧本。

jQuery：如果选择了特定的<select>选项，则显示div？</select>

3 个答案: