时间戳

首页 > 解决方案 > 如何通过选择的当前值更改背景颜色？

jquery - 如何通过选择的当前值更改背景颜色？

问题描述

使用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,
}

我什至不确定脚本是否已加载。你能指出正确的方法吗？

标签： jqueryhtmlasp.net-corebootstrap-4

解决方案

 <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);

请试试。

推荐阅读