Webmatrix如何添加一个类，如果输入类型文本框不是空的

本文关键字：文本 类型 输入 如果 何添加 添加 Webmatrix 一个 | 更新日期: 2023-09-27 18:10:40

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

.cshtml 

@{
    var value= string.IsNullOrEmpty;
}
<form action="">
    <input type="text" value="@value" class="@(value=!null ? "thisclass" : "")">
</form>

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

Webmatrix如何添加一个类，如果输入类型文本框不是空的

开始一个新的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>

正如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');
        }
    });
});
相关文章：