我有许多HTML选择框,它们是由PHP中的do-while循环创建的。通常,框的数量从1到大约6不等。然后我有一行复选框以相同的方式创建。选择框提供数字选择,例如0到5.如果选择的值为1或更多的选择框,我想隐藏相应的复选框。
实际页面超过500行,因此很难看到树木。出于测试目的,我创建了一个极简主义文件来玩。我目前的代码是:
<?php
// Loop through the rooms
$i=1;
do {
$roomtype = $row_room['roomtype'];
$room_id = $row_room['room_id'];
$roomnumber = $row_room['number'];
$selectroom = "<div><br>
<br>
ID ".$room_id." <select id=\"s".$room_id."\" name=\"numrooms[".$room_id."]\">";
$selectroom .= "<option value=\"\" selected>Select</option>";
$k=1;
if ($roomnumber ==NULL||$roomnumber ==0||$roomnumber >5) {$roomnumber = 5;};
while ($k<=$roomnumber) {
$selectroom .= "<option value=\"".$k."\"> ".$k."</option>";
$k++;
}
$selectroom .= "</select></div>";
echo $selectroom;
?>
<script>
$('#s<?php echo $room_id ?>').change(function(){
if($(this).val()>0){
$('#<?php echo $room_id ?>').css('display', 'none');
}else{
$('#<?php echo $room_id ?>').css('display', 'inline-block');
}
});
</script>
<?php } while ($row_room = mysql_fetch_assoc($room));
?>
<br>
<br>
<?php // Alternative room choice
mysql_data_seek($room,0);
while ($row_room = mysql_fetch_assoc($room)) { ?>
<label id="<?php echo $row_room['room_id'] ?>" style="display:inline-block"><input name="altroom[]" type="checkbox" value="<?php echo $row_room['roomtype'] ?>">
<?php echo "Item with ID ".$row_room['room_id']." "; ?></label>
<?php }?>
正如您所看到的,执行隐藏的jQuery脚本放在do-while循环中,因此会重复多次(值的变化)。在我看来,这是一个非常粗糙和不优雅的解决方案。我想将脚本移到php之外,只需要一次。我怎样才能做到这一点?
编辑:破解了!我补充说:
onchange=\"dropAlternative(".$room_id.")\"
到HTML选择并将Javascript移动到页面正文的末尾。
然后脚本变成了:
function dropAlternative(roomID) {
if($('#s' + roomID).val()>0){
$('#' + roomID).css('display', 'none');
}else{
$('#' + roomID).css('display', 'inline-block');
}
}
对于这里的Javascript专家来说,这可能完全不起眼,但作为一个Javascript numpty,我对自己感到非常满意。