Javascript 使用json和select的依赖关系

我有一个json：

{
    "A": {
        "1": "1",
        "2": "2",
        "3": "3"
    }, 
    "B": {
        "4": "4",
        "5": "5",
        "6": "6"
    }, 
    "C": {
        "7": "7",
        "8": "8"
    }
}

然后选择两个：

<select id="main">
  <option></option>
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

以及：

例如，我想：

如果我在selectmain中选择了一个，那么它应该在selectsub中隐藏4、5、6、7和8

如果我在selectmain中选择B，那么它应该在selectsub中隐藏1、2、3、7和8

如果我在selectmain中选择C，那么它应该在selectsub中隐藏1、2、3、4、5和6

使用json中的依赖项

---

如果不使用AJAX，我如何实现它？

如果您手头有对象，则不需要使用AJAX：

试一试

---

你的标题与问题无关。你说的AJAX是什么意思？您没有描述任何服务器请求。很抱歉，我更正了标题Perfect，非常感谢：您能将此代码修改为“开始工作”吗？我将selected设置为B，但在启动时没有working@rafael3444这边

<select id="sub">
  <option></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
</select>

var $sub = $('#sub');
$sub.find('option:gt(0)').remove();
$('#main').on('change', function(){
     var options = opts[this.value];
    $sub.find('option:gt(0)').remove();
    var $this = $(this);
    $sub.append($.map(options, function(i, o){

        return $('<option/>', {value:i, text:o});
    }));
});