是这样的。有两个下拉框。这两个下拉框的值是一样的。假设有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
提交
取消