诀窍是订阅更改事件并相应地重置第二个框的内容。
HTML：
<select id="brand"> <option value="">- select -</option> <option value="nokia">Nokia</option> <option value="apple">Apple</option> </select><select id="type"></select>
Javascript（准备就绪）：
var selectBrand = $("#brand");var selectType = $("#type");var optionsList = { nokia: [ "C6-01", "E7-00" ], apple: [ "iPhone 3", "iPhone 3G", "iPhone 4" ]};selectBrand.change(function() { var brand = selectBrand.val(); var options = optionsList[brand]; var html; if (options) { html = '<option value="">- select -</option>'; $.each(options, function(index, value) { html += '<option value="' + value + '">' + value + '</option>'; }); } else { html = '<option value="">Select a brand</option>'; } selectType.html(html);}).change();有关完整示例，请参见http://www.jsfiddle.net/TJJ8f/
