选择特定值时显示新字段（JS / HTML）

Question

我有这样的表格：

http://dl.dropbox.com/u/14698783/project/register/form.htm

默认情况下隐藏城市输入 我想在访客选择美国或加拿大时展示它。

Answer 1

以下是一些线索：

1. 使用jQuery .change()
捕获onchange
2. 使用jQuery .val()
获取所选的选项值
3. 如果选择选项值是您需要的值之一，请使用jQuery .show()显示另一个输入框（并.hide()隐藏它）

Answer 2

为此，我正在使用jQuery。首先，我使用change方法为国家/地区下拉列表设置和事件处理程序 - 这将在值更改时引发（不足为奇）。然后测试所选值是否在一组可接受的值中（为此，我使用'in' operator）。由于this是一个输入元素，我可以引用element.value而不将其包装在jQuery中。最后，使用toggle，传入布尔值以指示是否应显示或隐藏选择。

var valuesToShowFor = [0, 1]; // USA + Canada

$("#title").change(function() {
    var shouldShowCity = (this.value in valuesToShowFor);
    $("#city").toggle(shouldShowCity);
});

示例：http://jsfiddle.net/jonathon/xULyc/

为此，我建议在元素上使用ID。它使jQuery选择变得更容易和更简洁 - 否则你需要$("input[name='title']")之类的东西来引用元素。