|
<?php
$CRLF = chr(0x0d).chr(0x0a);
echo '<SELECT id="select01" size="1">'.$CRLF;
echo ' <option value="1">___________________'.$CRLF;
echo ' <option value="2">A'.$CRLF;
echo ' <option value="3">B'.$CRLF;
echo '</SELECT>'.$CRLF;
echo '<SELECT id="select02" size="4">'.$CRLF;
echo ' <option value="1">........'.$CRLF;
echo ' <option value="2">C'.$CRLF;
echo ' <option value="3">D'.$CRLF;
echo ' <option value="4">F'.$CRLF;
echo ' <option value="5">F1'.$CRLF;
echo ' <option value="6">F2'.$CRLF;
echo ' <option value="7">F3'.$CRLF;
echo ' <option value="8">F4'.$CRLF;
echo '</SELECT>'.$CRLF;
echo '<SELECT id="select03" size="8">'.$CRLF;
echo ' <option value="1">........'.$CRLF;
echo ' <option value="2">C2'.$CRLF;
echo ' <option value="3">D2'.$CRLF;
echo ' <option value="4">F2'.$CRLF;
echo '</SELECT>'.$CRLF;
echo '<SELECT id="select04" size="1">'.$CRLF;
echo ' <option value="1"> '.$CRLF;
echo ' <option value="2">G'.$CRLF;
echo ' <option value="3">H'.$CRLF;
echo '</SELECT>'.$CRLF;
?>
После выполнения получите такую картинку:
<SELECT id="select01" size="1">
<option value="1">___________________
<option value="2">A
<option value="3">B
</SELECT>
<SELECT id="select02" size="4">
<option value="1">........
<option value="2">C
<option value="3">D
<option value="4">F
<option value="5">F1
<option value="6">F2
<option value="7">F3
<option value="8">F4
</SELECT>
<SELECT id="select03" size="8">
<option value="1">........
<option value="2">C2
<option value="3">D2
<option value="4">F2
</SELECT>
<SELECT id="select04" size="1">
<option value="1">
<option value="2">G
<option value="3">H
</SELECT>
Выводы:
1. От параметра size зависит высота списка и его стиль.
2. Ширина списка зависит от длины текста самого длинного элемента списка. Если применяется не моноширинный шрифт, то получается, что длина еще зависит от содержимого элемента (например, строка '___' длиннее, чем '...', хотя обе состоят из 3-х символов).
3. Строка из пробелов в качестве элемента списка тоже отображается, но количество пробелов не влияет на ширину списка.
Выпадающий список можно анализировать и выполнять в зависимости от этого определенные действия, если добавить обработчик выбора и в нем использовать значение параметра value.
Пример1 c использованием JavaScript, файл index.htm:
<html><body>
<script language="JavaScript" type="text/javascript" src="tools.js"></script>
<SELECT id="select01" size="1" onchange="seltag()">
<option value="1">___________________
<option value="2">A
<option value="3">B
</SELECT>
</body></html>
файл part1.htm:
Пользователь выбрал пункт 1
файл part2.htm:
Пользователь выбрал пункт 2
файл part3.htm:
Пользователь выбрал пункт 3
файл tools.js:
function seltag()
{
var p;
p=document.all["select01"].value;
document.location = "part"+p+".htm";
}
Здесь при пользовательском выборе (onchange) срабатывает процедура seltag(), где берется значение value, из неё формируется имя открываемого html-файла (partN.htm) в соответствующий файл происходит переход.
Пример2 c использованием исключительно PHP, файл index.php:
<html><body>
<SELECT ID="Forms Combo Box2" NAME="cbAcrSorting" onchange="window.location='index.php?sorting='+this.value">
<?php
$sort = ($_GET["sorting"] == 'no_sorting')?false:true;
echo '<option value="no_sorting" '.($sort?'':'SELECTED').'>нет сортировки</option>'.$CRLF;
echo '<option value="sorting" '.(!$sort?'':'SELECTED').'>по порядку</option>'.$CRLF;
?>
</SELECT>
</body></html>
Этот пример кажется совсем простым, однако это не так. Код выводит выпадающий список, который предназначен для выбора порядка сортировки - генерируются теги OPTION. При изменении пользователем содержимого выпадающего списка (onchange) вызывается тот же самый файл, и выбранное пользователем значение передается через переменную sorting. Это означает, что строку браузера будет попадать либо:
http://test1.ru/index.php?sorting=sorting
если пользователь выбрал "по порядку", или:
http://test1.ru/index.php?sorting=no_sorting
если пользователь выбрал "без сортировки".
Выборка значения переменной осуществляется оператором $_GET["sorting"]. Выбранное значение списка "запоминается" благодаря генерации параметра SELECTED в нужной строке выпадающего списка.
|
