如何通過select的當前值更改背景顏色？

Question

使用asp-core net 2.2 mvc，我想通過select的當前值更改div標簽的背景顏色

我在視圖中定義了以下選擇：

<div id="bgcolor" class="form-group">
  <label asp-for="BackGround" class="control-label"></label>
    <select asp-for="BackGround" asp-items="Html.GetEnumSelectList<BackGroundColor>()" onchange="changeBackground">
      <option selected="selected" value="">Please select</option>
    </select>
</div>

然后我添加了腳本：

@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script>
    function changeBackground(value) {
        $("#bgcolor").removeClass("bg-primary bg-secondary bg-warning").addClass(value)
    };
</script>
}

枚舉具有以下值

public enum BackGroundColor
{
    bg-primary,
    bg-secondary,
    bg-success,
    bg-danger,
    bg-warning,
}

我什至不確定腳本是否已加載。 您能指出正確的方法嗎？

Answer 1

 <select asp-for="BackGround" asp-items="Html.GetEnumSelectList<BackGroundColor>()" onchange="changeBackground(this)">

 function changeBackground(data) { //put this data.value where ever you want alert(data.value); } 

  $("#bgcolor").removeClass("bg-primary bg-secondary bg-warning").addClass(data.value); 

請試試。