在程序生成的select元素列表中更改特定select元素的背景色

我正嘗試使用jQuery來根據選擇內部選項更改select元素的背景顏色。在程序生成的select元素列表中更改特定select元素的背景色

要生成的選擇元素，我使用下面的代碼：

while ($qrow = $qquery->fetch(PDO::FETCH_ASSOC)) { 
      $aqanswer = "qAnswer" . $qrow['questionID'] . ""; 
      $aqcomments = "qComments" . $qrow['questionID'] . ""; 
      echo "<tr><td class='auditf'>" . $qrow['qDesc'] . "</td><td class='auditm'><select name='qAnswer" . $qrow['questionID'] . "' form='entryform' id = 'selectqAnswer". $qrow['questionID'] ."'>"; 
      if (isset($_SESSION[$aqanswer])) { 
       if ($_SESSION[$aqanswer] === 'Green') { 
        echo "<option value='Green' selected='true' class = 'green'>Green</option>"; 
        echo "<option value='Red' class='red'>Red</option>"; 
       } elseif ($_SESSION[$aqanswer] === 'Red') { 
        echo "<option value='Green' class ='green'>Green</option>"; 
        echo "<option value='Red' selected='true' class = 'red'>Red</option>"; 
       } 
       unset($_SESSION[$aqanswer]); 
      } else { 
       echo "<option value='Green' selected='true' class = 'green'>Green</option>"; 
       echo "<option value='Red' class = 'red'>Red</option>"; 
      } 
      echo "</select></td><td class='auditl'><textarea name='qComments" . $qrow['questionID'] . "' rows='3' cols='30' maxlength='255' value='N/A'>"; 
      if (isset($_SESSION[$aqcomments])) { 
       echo $_SESSION[$aqcomments]; 
       unset($_SESSION[$aqcomments]); 
      } else { 

      } 
      echo "</textarea></td></tr>"; 
     }

而且我的jQuery：

$("[id^=selectqAnswer]").change(function() { 
    var color = $("option:selected", this).attr("class"); 
    $("[id^=selectqAnswer]").attr("class", color); 
});

現在這個工作，但它會導致頁面上的每一個盒明顯地改變。問題是，頁面上的框數量可能會根據用戶選項而改變，所以我沒有固定的選擇ID列表，我可以在我的jQuery中單獨引用。我嘗試過使用谷歌搜索這個問題，但每一個結果都是專門爲ID命名，而不是使用程序生成的ID。當我不知道什麼時候ID會特別提前時，我怎麼才能根據所選擇的選項更改特定選擇元素的背景顏色。

來源

2016-10-17 SGR

變化'$（「[id^= selectqAnswer]」）。attr（「class」，color）;'to'$（this）.attr（「class」，color）;'。 – Huelfe

@Huelfe謝謝。 – SGR

你也可以使用'$（this）.addClass（color）;'。 - https://api.jquery.com/addclass/ –

$("[id^=selectqAnswer]").attr("class", color);

這將改變顏色，每#selectqAnswer選擇，如果你想改變當前選擇使用this

顏色的Javascript

$(this).attr("class", color);

來源

2016-10-17 09:36:43

謝謝你和上面的評論者。我會盡快接受。 – SGR

在程序生成的select元素列表中更改特定select元素的背景色

回答

相關問題