在我的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>
答案 0 :(得分:0)
使用解决方案制作jsfiddle
<强> HTML 强>
<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>
<强> JS 强>
$(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);
}