开发工具与关键技术:VisualStudio C#
作者:落白
撰写时间:2019/06/17
对于添加元素分为手动添加与有条件的自动添加。相对而言,手动添加的操作性更强,自动添加则更为准确和省力。但无论是手动添加还是自动添加都是开具体情况来使用的,主要开项目的需求。
下面要说介绍的是限定条件自动循环添加选项。举个例子,下面有三个下拉框,分别是成人、儿童、婴儿。而游乐场有限定,一个成人只能带一个儿童或者婴儿,儿童和婴儿不能单独买票。而且成人、儿童、婴儿加起来的数量不能大于9,大于9时就要购买团队票。接下来我们就需要根据这个限定条件来实现循环添加选项。
成人的下拉框选项直接用for循环来直接添加,因为它受到的约束条件只是小于9。儿童下拉框则根据成人下拉框的改变事件来添加,婴儿下拉框则根据儿童事件的改变事件来添加。最终实现的效果是成人+儿童+婴儿<10
功能代码:
//循环添加成人下拉框的选项
for (var i = 1; i <=9; i++) {
$("#Select").append("<option onclick='AdultNumber(this)'>" + i + "</option>");
}
//成人下拉框改变事件
$("#Select").change(function () {
var AdultS = $("#Select").val();
var Childerns = 9 - AdultS;
$("#children").empty();
//循环添加成人下拉框的选项
for (var j = 0; j <= Childerns; j++) {
$("#children").append("<option>" + j + "</option>");
}
});
//儿童下拉框改变事件
$("#children").change(function () {
var AdultS = $("#Select").val();
var Childrens = $("#children").val();
var Babys = 9 - AdultS - Childrens;
$("#baby").empty();
//循环添加成人下拉框的选项
for (var K = 0; K <= Babys; K++) {
$("#baby").append("<option>" + K + "</option>");
}
});