是这样的。有两个下拉框。这两个下拉框的值是一样的。假设有10个值(0~9)按照从小到大排列其中第一个下拉框的 ID= A1 NAME=A1,第二个下拉框 ID = B1 NAME = B1选择第一个下拉框的时候,选择某一个值之后,第二个下拉框的值默认变成第一个下拉框的值,而且第二个下拉框的值只可以选择 之后的三个值。举两个例子eg1:第一个选择了4。第二个下拉框变为4,而且第二个下拉框的内容变为5、6、7。eg2:第一个选择了1。第二个下拉框变为1,第二个下拉框可以选择的值只有2、3、4。不管怎样,先感谢大佬们的帮忙。
2 回答
已采纳
酒木君
TA贡献23条经验 获得超7个赞
<hr/> <select id="status1"> <option value="0">A0</option> <option value="1">A1</option> <option value="2">A2</option> <option value="3">A3</option> <option value="4">A4</option> <option value="5">A5</option> <option value="6">A6</option> <option value="7">A7</option> <option value="8">A8</option> <option value="9">A9</option> </select> <select id="status2"> <option value="0">B0</option> <option value="1">B1</option> <option value="2">B2</option> <option value="3">B3</option> <option value="4">B4</option> <option value="5">B5</option> <option value="6">B6</option> <option value="7">B7</option> <option value="8">B8</option> <option value="9">B9</option> </select>
<script type="text/javascript">
$("select#status1").change(function(){
var status1 = $(this).val();//得到第一个下拉框的value值
var status2 = parseInt(status1)+1;//将字符串转为数字并进行+1操作
var status3 = status2+1;//+2
console.log(status1,status2,status3);
//进行字符串拼接
var text1 = "B"+status1;
var text2 = "B"+status2;
var text3 = "B"+status3;
console.log(text1,text2,text3);
$("#status2").empty();//清空第二个下拉框
//根据status1判断,避免第二个下拉框中出现违规值
if(status1 <= 7){
//将得到的文本值分别放入第二个下拉框中
var option1 = $("<option>").val(1).text(text1);
$("#status2").append(option1);
var option2 = $("<option>").val(1).text(text2);
$("#status2").append(option2);
var option3 = $("<option>").val(1).text(text3);
$("#status2").append(option3);
}else if(status1 == 8){
var option1 = $("<option>").val(1).text(text1);
$("#status2").append(option1);
var option2 = $("<option>").val(1).text(text2);
$("#status2").append(option2);
}else if(status1 == 9){
var option1 = $("<option>").val(1).text(text1);
$("#status2").append(option1);
}
});
</script>根据楼主的要求自己写了一个小demo,亲测可以达到楼主所述目标.
添加回答
举报
0/150
提交
取消
