是否有任何技術可以指示html select元素是否被「使用」？

想象一下，我有許多不同的過濾器的Web應用程序，這會影響在頁面上搜索結果。是否有任何技術可以指示html select元素是否被「使用」？

這些過濾器是可選的，我使用select元素。第一個選項總是意味着過濾器沒有被使用，並且表示「未使用」或「選擇xyz」。

我現在正在尋找一種方法，以便快速瀏覽哪些過濾器當前正在使用，哪些不是，例如，通過改變顏色或背景顏色。

我沒有找到一種方法來通過CSS做到這一點，也許它不可能沒有JavaScript？解決方案只需要在最新的Chrome中工作。

來源

2012-09-27 Riesling

您想要什麼顏色改變？只要用戶更改下拉菜單，當頁面重新加載？ – Travesty3

會好的 – Riesling

不是沒有服務器端或JavaScript的組件，沒有。有['：checked']（http://www.w3.org/TR/css3-selectors/#checked），但這僅適用於（可預測的）複選框和廣播元素。 –

如果您希望在用戶更改選擇後立即更改下拉列表的顏色（無需重新加載頁面），則必須使用JavaScript。例如：

<script type="text/Javascript"> 
    function changeColor(element) 
    { 
     if (element.selectedIndex != 0) 
      element.style.backgroundColor = "green"; 
     else 
      element.style.backgroundColor = "red"; 
    } 
</script> 

<select onchange="changeColor(this)">

所以這就是當用戶改變選擇時就要改變顏色的方法。

要在頁面重新加載時更改它，您將不得不使用一些服務器端腳本語言（我假設您已經使用了該語言）。因此，在創建<select>元素時，您會檢查是否已設置其值。如果您使用PHP，它可能看起來像這樣：

<select name="mySelect" style="background-color:<?php echo ($_POST["mySelect"] == "select xyz" ? "red" : "green"); ?>;">

來源

2012-09-27 15:18:40 Travesty3

好吧，我擔心這不可能通過CSS。我知道如何在JavaScript/PHP中，但感謝您的答案 – Riesling

是否有任何技術可以指示html select元素是否被「使用」？

回答

相關問題