我必须为预订表格编写一个简单的脚本。这个想法是显示每个选定房间的成人和儿童输入数。但是如果输入了孩子的数量,我需要为每个孩子显示年龄字段。
像这样 :
Number of Rooms - 2
Room-1
Adults: 2 Children: 2
Children Age[1] : 10 Children Age[2] : 15
--------------------------------------
Room-2
Adults: 2 Children: 1
Children Age[1] : 6
--------------------------------------
这就是想法(如 Expedia 搜索框)。
这是我的代码,几乎可以工作。但是当我选择儿童年龄时,成人和儿童输入消失了。
在我的代码中:
enter code here
<lablel>ROOMS</lablel>
<select id="rooms" name="rooms" size="1"/>
<option val="">-?-</option>
<option val="1">1</option>
<option val="2">2</option>
<option val="3">3</option>
<option val="4">4</option>
<option val="5">5</option>
</select>
<div id="showRoom1" style="display:<?php echo $selhab1 ;?>">Room [1]
<label>ADULTS</lablel><lablel>CHILDREN</lablel>
<select required id="seldos" name="adlr1" size="1">
<option value="">--?--</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<select id="child" name="chl" size="1" />
<option val="0">--</option>
<option val="1">1</option>
<option val="2">2</option>
<option val="3">3</option>
<option val="4">4</option>
<option val="5">5</option>
</select>
<div id="show1" style="display:<?php echo $seled1 ;?>">Age Child [1]
<?php
echo'<select class="seldos" id=select name="age1" id="age1" >';
if($age1 == ''){
echo'<option value="--">-?-</option>';
}else{
print "<option value='$age1'>$edad1</option>";
}
for ($i = 1; $i <= $maxage; $i++) {
echo "<option value=$i>";
echo "$i</option>";
}
print"</select></div>";
?>
<div id="show2" style="display:<?php echo $seled2 ;?>">Age Child [2]
<?php
echo'<select class="seldos" name="edad2" id="age2">';
if($age2 == ''){
echo'<option value="--">-?-</option>';
}else{
print "<option value='$age2'>$age2 </option>";
}
for ($i = 1; $i <= $maxage; $i++) {
echo "<option value=$i>";
echo "$i</option>";
}
print"</select></div>";
?>
.
.
.
**** UNTIL CHILD AGE 5
</div>
<script>
$("#rooms").bind("change", function () {
var value = parseInt(this.value, 10);
$("div[id^='showRoom']").hide();
for(var i = 1; i <= value; i++) {
$("#showRoom" + i).fadeIn(300);
}
});
$("#child").bind("change", function () {
var value = parseInt(this.value, 10);
$("div[id^='show']").hide();
for(var i = 1; i <= value; i++) {
$("#show" + i).fadeIn(300);
}
});
</script>