Question

如果输入类型文本框不为空或null，我想添加一个类。我试图做这样的事情。

.cshtml

@{
    var value= string.IsNullOrEmpty;
}

<form action="">
    <input type="text" value="@value" class="@(value=!null ? "thisclass" : "")">
</form>

我很抱歉这个糟糕的例子，但我真的不知道如何解释它而且我没有使用MVC或数据库，这是一个简单的输入type="text"框。请帮助！

Answer 1

开始了一个新的MVC项目。

这是我在Index.cshtml中使用的代码，它工作正常。（我在文本字段中得到一个红色背景）

@{
    ViewBag.Title = "Home Page";

    var value = string.Empty;
}

<style type="text/css">
    .testclass {
        background-color: red;
    }
</style>

<div class="jumbotron">
    <h1>ASP.NET</h1>
    <input type="text" class="@(string.IsNullOrWhiteSpace(value) ? "testclass" : "")" />
    <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
    <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
</div>

Answer 2

如NoLifeKing所述，这是服务器端解决方案，用于测试输入是否为空并相应地更改其类：

<input type="text" id="testinput" value="@value" 
   class="@(string.IsNullOrEmpty(value) ? "thisclass" : "")"  />

如果您希望输入类在编写时发生更改，则必须使用jquery，例如：

$(document).ready(function () {
    $('#testinput').keyup(function () {
        if (!this.value) {
            $(this).addClass('thisclass');
        } else {
            $(this).removeClass('thisclass');
        }
    });
});

Webmatrix如果输入类型文本框不为空，如何添加类？

2 个答案: