JQuery移动选择菜单的选定选项选定值

在我的php文件中，我有两个选择菜单。选择第一个后，第二个将使用jquery获取值。它在简单的php文件中运行良好。但当使用JQuery mobile粘贴到文件时，会出现一个小问题： 更改第一个选项后，第二个选项的值会发生细微变化，但第一个选项的选定选项仍然保留

这是我的.js文件：

function deg(){
var id = document.getElementById("il").options[document.getElementById("il").selectedIndex].value;
var ilcx;

switch(id){
case "a":
ilcx = {"x" : "x"
}; break;
case "b":
ilcx = {"y" : "y"
}; break;
case "c":
ilcx = {"c" : "c"
}; break;

}

var $el = $("#ilcx");
$el.empty(); 
$.each(ilcx, function(key, value) {
  $el.append($("<option></option>")
     .attr("value", value).text(key));
});

以及php的部分：

 <select name="il" id="il" onchange="deg();">
                            <option id="a" value="a">a</option>
                            <option id="b" value="b">b</option>
                            <option id="c" value="c">c</option>
  </select>
                        <select name="ilcx" id="ilcx">
                            <option id="x" value="x">x</option>
                            <option id="y" value="y">y</option>
                            <option id="z" value="z">z</option>

    </select>

用这个解决方案做了一个实验

HTML

JS

---

是否要从第一个选择框中删除所选选项？当第一个选择框和第二个选择框的值发生更改时，我要删除第二个选择框的上一个选择。实际上，我设置了第一个和第二个选择菜单的第一个选择值。当用户更改第一个选项时，第二个选项的值将更改，但之前的值和初始值将保留，直到用户从新选项中选择一个选项。如果我理解正确，第二个选择框将完全过时，我认为您应该将其作为输入并更改其值。。。答案已更新否必须有有限的选择。所以第二个选择框应该存在。好的，我想现在我知道了，修改了整个答案。

<select name="il" id="il">
    <option id="a" value="x" selected="selected">a</option>
    <option id="b" value="y">b</option>
    <option id="c" value="c">c</option>
</select>
<select name="ilcx" id="ilcx">
    <option id="x" value="x" selected="selected">x</option>
    <option id="y" value="y">y</option>
    <option id="z" value="z">z</option>
</select>

$(document).on('change', '#il', function() { deg(this); });

function deg(obj){
    var val = obj.value,
        $el = $('#ilcx'),
        $opt = $('<option />');

    $opt.val(val).text(val).appendTo($el);
}