阅读量:0
PHP 的 selected 选项本身不能直接自定义样式。但是，你可以通过结合 HTML 和 JavaScript（或 jQuery）来实现自定义样式的需求。
以下是一个简单的示例，展示了如何在 PHP 中生成下拉菜单，并使用 JavaScript 为选定的选项添加自定义样式：
- 首先，创建一个 PHP 文件（例如：
dropdown.php），并在其中生成下拉菜单：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dropdown Example</title> <style> .selected { background-color: #f1f1f1; color: #333; } </style> </head> <body> <select id="dropdown" onchange="updateSelectedStyle()"> <?php $options = [ 'Option 1' => 'option1', 'Option 2' => 'option2', 'Option 3' => 'option3', ]; foreach ($options as $value => $text) { echo '<option value="' . htmlspecialchars($value) . '" ' . ($value == 'option2' ? 'selected' : '') . '>' . htmlspecialchars($text) . '</option>'; } ?> </select> <script> function updateSelectedStyle() { const dropdown = document.getElementById('dropdown'); const selectedOption = dropdown.options[dropdown.selectedIndex]; // Remove the 'selected' class from all options for (let i = 0; i < dropdown.options.length; i++) { dropdown.options[i].classList.remove('selected'); } // Add the 'selected' class to the selected option selectedOption.classList.add('selected'); } </script> </body> </html> 在这个示例中，我们首先使用 PHP 生成一个包含三个选项的下拉菜单。然后，我们使用内联样式表定义了一个名为 .selected 的 CSS 类，用于设置选定选项的背景颜色和文本颜色。
接下来，我们使用 JavaScript 编写一个名为 updateSelectedStyle 的函数，该函数在下拉菜单的选项发生变化时被调用。这个函数首先获取当前选定的选项，然后从所有选项中删除 selected 类，最后将 selected 类添加到选定的选项。
现在，当用户选择一个不同的选项时，选定的选项将自动应用自定义样式。
