尝试根据 Razor 页面上的复选框值更改 <td> 背景颜色

Question

我希望只要选中其中的复选框，它就会变成红色。 Html.DisplayFor 让事情变得有点复杂。 SQL 服务器 table 中的 Inactive 字段是布尔值、零或一。

<td align="center">

        @Html.DisplayFor(modelItem => item.Inactive)

</td>

查看 table 时，该值是 0 或 1。该页面显示了一个所需的复选框，但我无法尝试引用它的值并设置周围 table单元格。

Answer 1

尝试用EditFor代替DisplayFor，然后在你的视图中加入如下js：

function changeColor(t) {
            if (t.checked) {
                $(t).parent().css('background', 'red');
            } else {
                $(t).parent().css('background', 'none');
            }
            
        }
        $('input[type=checkbox]').change(function () {
            changeColor(this);
        })
$(function () {
            $('input[type=checkbox]').each(function () {
                changeColor(this);
            });
           
        })

尝试根据 Razor 页面上的复选框值更改 <td> 背景颜色

Trying to change <td> background color based on checkbox value on Razor page

html

displayfor

asp.net-core

razor-pages